
/* v2.1: language switch + B2B billing disclosures. */
.lang-switch,.ar-lang{min-height:42px!important;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;touch-action:manipulation}
.lang-switch:focus-visible,.ar-lang:focus-visible,.payment-link:focus-visible{outline:3px solid #cfff79;outline-offset:4px}
.payment-panel{margin:26px auto 0;max-width:1170px;border-radius:26px;background:#eff5e9;border:1px solid #d6e4d3;color:#17382b;overflow:hidden;box-shadow:0 18px 38px rgba(7,40,26,.06)}
.payment-panel-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(20px,3.6vw,36px)}
.payment-eyebrow{display:block;color:#37644d;font-size:11px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;margin-bottom:10px}
.payment-panel h2,.payment-panel h3{font-size:clamp(22px,3vw,29px);color:#12342b;font-weight:850;line-height:1.18;margin:0 0 10px}
.payment-panel p{font-size:14px;line-height:1.7;max-width:670px;margin:0;color:#426153}
.payment-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:50px;padding:12px 22px;color:#132f24!important;background:#d6fb7b;font-weight:850;text-align:center;white-space:nowrap;text-decoration:none;transition:transform .2s ease}
.payment-link:hover{transform:translateY(-2px)}
.payment-keypoints{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.payment-keypoints span{border-radius:50px;border:1px solid #c3d7c5;padding:7px 11px;color:#294f39;font-size:12px;font-weight:700;background:#fff9}
.payment-page{background:#f7f9f3;color:#15372c;min-height:65vh}
.payment-page-hero{background:#102e25;color:#fff;padding:clamp(70px,10vw,125px) 0 clamp(50px,7vw,88px)}
.payment-wrap{width:calc(100% - 40px);max-width:1140px;margin-inline:auto}
.payment-page-hero .payment-eyebrow{color:#d2f77d}
.payment-page-hero h1{font-size:clamp(39px,7vw,76px);line-height:1.07;max-width:850px;letter-spacing:-.04em;margin:0 0 22px;color:#fff}
.payment-page-hero p{color:#d0e0d6;font-size:clamp(15px,2vw,18px);line-height:1.75;max-width:750px;margin:0}
.payment-page-content{padding:clamp(35px,6vw,74px) 0 80px}
.payment-section-title{font-size:clamp(26px,4vw,42px);color:#173a2d;margin:0 0 14px;letter-spacing:-.025em}
.payment-intro{font-size:15px;line-height:1.75;color:#567062;max-width:775px;margin:0 0 26px}
.payment-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}
.payment-step{background:#fff;border:1px solid #dce7d8;border-radius:22px;padding:26px;box-shadow:0 8px 22px #133c2610;min-width:0}
.payment-step small{display:inline-flex;background:#d7fb88;color:#19392b;font-weight:900;letter-spacing:.08em;border-radius:9px;padding:7px 9px;margin-bottom:20px}
.payment-step h3{font-size:21px;line-height:1.25;color:#153b2b;margin:0 0 10px}
.payment-step p{font-size:14px;line-height:1.7;color:#526e5f;margin:0}
.payment-summary{margin-top:28px;padding:24px;border:1px solid #b9d6be;border-radius:22px;background:#e9f3e7}
.payment-summary p{font-size:14px;color:#3f614b;line-height:1.65;margin:0}
.payment-table-wrap{overflow-x:auto;border-radius:20px;border:1px solid #dae7d9;margin:22px 0 28px}
.payment-table{border-collapse:collapse;min-width:530px;width:100%;background:#fff}
.payment-table th{background:#193d31;color:#e4f4da;font-size:13px;text-align:start;padding:16px}
.payment-table td{padding:17px 16px;border-top:1px solid #e7eee5;color:#1c4432;font-size:14px;font-weight:650}
.payment-table tr:nth-child(even) td{background:#f4f8f0}
.payment-small{color:#597267;font-size:12px;line-height:1.7}
.payment-foot-cta{display:flex;justify-content:space-between;align-items:center;gap:22px;border-radius:26px;padding:28px 30px;background:#15372c;color:#fff;margin-top:30px}
.payment-foot-cta h2{font-size:clamp(22px,3vw,30px);margin:0 0 8px;color:#fff}
.payment-foot-cta p{font-size:14px;color:#cfdfd4;line-height:1.65;margin:0;max-width:600px}
.payment-footer-link{display:inline-flex;gap:5px;align-items:center;min-height:38px}
.ba-plan-price:after{content:'VAT included';display:block;font-size:11px;font-weight:700;color:#647968;margin-top:2px}
.ar-plan-price:after{content:'شامل ضريبة القيمة المضافة';display:block;font-size:11px;font-weight:700;color:#648375;margin-top:2px}
[dir=rtl] .payment-panel,[dir=rtl] .payment-page,[dir=rtl] .payment-page-hero{text-align:right}
[dir=rtl] .payment-page-hero h1{letter-spacing:normal}
[dir=rtl] .payment-table th,[dir=rtl] .payment-table td{text-align:right}
[dir=rtl] .payment-eyebrow{letter-spacing:0}
@media(max-width:720px){
 .payment-panel{margin-top:20px;border-radius:22px}
 .payment-panel-inner{flex-direction:column;align-items:stretch;padding:22px;gap:18px}
 .payment-link{width:100%;white-space:normal}
 .payment-keypoints span{font-size:11px}
 .payment-page-hero{padding:58px 0 46px}
 .payment-page-content{padding:36px 0 100px}
 .payment-steps{grid-template-columns:1fr;gap:12px}
 .payment-step{padding:21px}
 .payment-foot-cta{flex-direction:column;align-items:stretch;padding:23px}
 .payment-wrap{width:calc(100% - 32px)}
 .payment-table th,.payment-table td{padding:13px 12px}
}
@media(prefers-reduced-motion:reduce){.payment-link{transition:none}}
/* Arabic pricing cards reuse the same component classes as English. */
html[lang="ar"] .ba-plan-price:after{content:'شامل ضريبة القيمة المضافة';letter-spacing:0}
/* Make each price breakdown self-contained on small screens; no hidden columns. */
@media(max-width:720px){
 .payment-table{display:block;min-width:0;width:100%;background:transparent}
 .payment-table thead{display:none}
 .payment-table tbody{display:grid;gap:10px;padding:10px;background:#f4f8f0}
 .payment-table tr,.payment-table tr:nth-child(even){display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#fff!important;border-radius:15px;padding:14px;border:1px solid #d6e4d4}
 .payment-table tr td{padding:0!important;border:0!important;background:transparent!important;font-size:14px;min-width:0;overflow-wrap:anywhere}
 .payment-table tr td:nth-child(1){grid-column:1/-1;font-size:16px;font-weight:850;color:#143b2b;padding-bottom:4px!important}
 .payment-table tr td:nth-child(2){grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;font-weight:850;color:#1c4834;border-bottom:1px solid #ecf0ea!important;padding-bottom:7px!important}
 .payment-table tr td:nth-child(3),.payment-table tr td:nth-child(4){border-radius:10px;background:#f0f6e9!important;padding:9px!important;line-height:1.4}
 .payment-table td:nth-child(2)::before,.payment-table td:nth-child(3)::before,.payment-table td:nth-child(4)::before{display:block;font-size:11px;font-weight:700;color:#557360;margin-bottom:4px}
 html[lang=en] .payment-table td:nth-child(2)::before{content:'Monthly fee'}
 html[lang=en] .payment-table td:nth-child(3)::before{content:'At start · 50%'}
 html[lang=en] .payment-table td:nth-child(4)::before{content:'After 20 days · 50%'}
 html[lang=ar] .payment-table td:nth-child(2)::before{content:'الأتعاب الشهرية'}
 html[lang=ar] .payment-table td:nth-child(3)::before{content:'بداية الشهر · ٥٠٪'}
 html[lang=ar] .payment-table td:nth-child(4)::before{content:'بعد ٢٠ يومًا · ٥٠٪'}
}
