/* Restream page (/restream): flow, protocols, coverage map, graphs, failover timeline, calculator. Logical properties
   only, so the Arabic page mirrors without extra rules. Region strip: regions.css (shared with pricing). */
.rs-actions{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:560px){.rs-actions .btn{flex:1 1 100%}}
.tag{display:inline-block;padding:3px 10px;border-radius:999px;font:600 12.5px/1.4 var(--font);white-space:nowrap}
.tag-live{background:var(--success-bg);color:var(--success)}
.tag-soon{background:#FEF3C7;color:#92400E}

/* How it flows: source -> hub -> destinations */
.rs-flow{display:grid;grid-template-columns:1fr auto 1.15fr auto 1fr;gap:14px;align-items:stretch;list-style:none}
.rs-node{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-sm)}
.rs-node h3{font-size:17px;display:flex;align-items:center;gap:10px}
.rs-node h3 .icon{width:22px;height:22px;color:var(--primary);flex:none}
.rs-node ul{margin-top:10px;list-style:none;display:grid;gap:6px;color:var(--muted);font-size:15px}
.rs-node.hub{background:var(--navy);color:#fff;border-color:var(--navy)}
.rs-node.hub h3 .icon{color:var(--sky)}
.rs-node.hub ul{color:rgba(255,255,255,.78)}
.rs-arrow{display:flex;align-items:center;color:var(--highlight)}
.rs-arrow svg{width:28px;height:28px}
html[dir=rtl] .rs-arrow svg{transform:scaleX(-1)}
@media (max-width:900px){.rs-flow{grid-template-columns:1fr}.rs-arrow{justify-content:center}.rs-arrow svg{transform:rotate(90deg)}html[dir=rtl] .rs-arrow svg{transform:rotate(90deg)}}

/* Protocol table */
.rs-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:#fff}
.rs-table{width:100%;border-collapse:collapse;font-size:15px}
.rs-table th,.rs-table td{padding:14px 16px;text-align:start;vertical-align:top;border-bottom:1px solid var(--border)}
.rs-table tr:last-child td{border-bottom:0}
.rs-table thead th{background:var(--cloud);font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
html[lang=ar] .rs-table thead th{text-transform:none;letter-spacing:0;font-size:14px}
.rs-table td:first-child{font-weight:600;white-space:nowrap}
.rs-table td.st{white-space:nowrap}
@media (max-width:700px){
  .rs-table thead{display:none}
  .rs-table,.rs-table tbody,.rs-table tr,.rs-table td{display:block;width:100%}
  .rs-table tr{padding:12px 16px;border-bottom:1px solid var(--border)}
  .rs-table tr:last-child{border-bottom:0}
  .rs-table td{padding:3px 0;border:0;white-space:normal}
  .rs-table td:first-child{white-space:normal}
}
.rs-note{margin-top:14px;font-size:14.5px;color:var(--muted)}

/* Coverage map */
.rs-map{background:var(--navy);border-radius:24px;padding:24px;color:#fff}
.rs-map svg{display:block;width:100%;height:auto}
.rs-map .land{fill:#1B2F66}
.rs-map .pin-live{fill:#34D399}
.rs-map .pin-soon{fill:none;stroke:#FBBF24;stroke-width:3;stroke-dasharray:4 3}
.rs-map .ring{fill:none;stroke:#34D399;stroke-width:2;opacity:.6}
.rs-map .lbl{fill:#fff;font:600 17px var(--font)}
.rs-map .lbl-sub{fill:rgba(255,255,255,.7);font:500 13px var(--font)}
.rs-map .link{stroke:rgba(147,197,253,.45);stroke-width:1.5;stroke-dasharray:5 5;fill:none}
@media (prefers-reduced-motion:no-preference){.rs-map .ring{animation:rs-pulse 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}}
@keyframes rs-pulse{from{transform:scale(.6);opacity:.8}to{transform:scale(1.8);opacity:0}}
.rs-legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px;font-size:14px;color:rgba(255,255,255,.8)}
.rs-legend span{display:inline-flex;align-items:center;gap:8px}
.rs-legend i{width:12px;height:12px;border-radius:50%;display:inline-block}
.rs-legend .l{background:#34D399}.rs-legend .s{border:2px dashed #FBBF24}
.rs-regions-grid{margin-top:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;list-style:none}
.rs-region{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.rs-region h3{font-size:17px}
.rs-region p{margin-top:6px;font-size:14.5px;color:var(--muted)}
.rs-region code{display:inline-block;margin-top:8px;font-size:13px;background:var(--cloud);padding:3px 8px;border-radius:6px;overflow-wrap:anywhere;direction:ltr}
@media (max-width:1000px){.rs-regions-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.rs-regions-grid{grid-template-columns:1fr}.rs-map{padding:14px;border-radius:18px}}

/* Graphs */
.rs-graphs{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:900px){.rs-graphs{grid-template-columns:1fr}}
.rs-graph{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px;min-width:0}
.rs-graph h3{font-size:18px}
.rs-graph .sub{margin-top:4px;font-size:14px;color:var(--muted)}
.rs-bars{margin-top:18px;display:grid;gap:12px;list-style:none}
.rs-bar{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) 7.5em;gap:10px;align-items:center;font-size:14px}
.rs-bar .track{height:12px;background:var(--cloud);border-radius:6px;position:relative;overflow:hidden}
.rs-gap{margin-top:20px}
.rs-wide{grid-column:1 / -1}
.w14{--w:14%}.w21{--w:21%}.w34{--w:34%}.w39{--w:39%}.w43{--w:43%}.w57{--w:57%}.w95{--w:95%}
.rs-bar .fill{position:absolute;inset-block:0;inset-inline-start:0;width:var(--w);background:linear-gradient(90deg,var(--primary),var(--highlight));border-radius:6px}
html[dir=rtl] .rs-bar .fill{background:linear-gradient(270deg,var(--primary),var(--highlight))}
.rs-bar b{font-weight:600;white-space:nowrap;text-align:end;direction:ltr;unicode-bidi:isolate}
@media (max-width:480px){.rs-bar{grid-template-columns:1fr auto}.rs-bar .track{grid-column:1 / -1;grid-row:2}}
.rs-cols{margin-top:18px;height:220px;display:flex;align-items:flex-end;gap:8px;border-bottom:1px solid var(--border);padding-top:22px}
.rs-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.rs-col .v{font-size:12px;font-weight:600;white-space:nowrap;margin-bottom:4px;direction:ltr}
.rs-col .c{width:100%;max-width:46px;background:linear-gradient(180deg,var(--highlight),var(--primary));border-radius:6px 6px 0 0;min-height:2px}
.rs-cols-x{display:flex;gap:8px;margin-top:6px}
.rs-cols-x span{flex:1;text-align:center;font-size:12.5px;color:var(--muted)}
.rs-axis{margin-top:6px;font-size:13px;color:var(--muted);text-align:center}
@media (max-width:420px){.rs-col .v{font-size:10.5px}}

/* Failover timeline */
.rs-timeline{margin-top:18px;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.rs-timeline li{position:relative;padding-top:34px;padding-inline-end:12px;font-size:14.5px;color:var(--muted)}
.rs-timeline li::before{content:"";position:absolute;top:13px;inset-inline:0;height:3px;background:var(--border)}
.rs-timeline li::after{content:"";position:absolute;top:6px;inset-inline-start:0;width:17px;height:17px;border-radius:50%;background:#fff;border:3px solid var(--primary)}
.rs-timeline li.bad::after{border-color:var(--danger)}
.rs-timeline li.ok::after{border-color:var(--success);background:var(--success)}
.rs-timeline b{display:block;color:var(--text);font-size:15px}
.rs-timeline time{display:block;font-weight:700;color:var(--primary);direction:ltr;unicode-bidi:isolate;text-align:start}
@media (max-width:700px){
  .rs-timeline{grid-template-columns:1fr}
  .rs-timeline li{padding-top:0;padding-inline-start:32px;padding-bottom:16px}
  .rs-timeline li::before{top:0;bottom:0;inset-inline-start:7px;inset-inline-end:auto;width:3px;height:auto}
  .rs-timeline li::after{top:2px}
}

/* Calculator */
.rs-calc{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:start}
@media (max-width:900px){.rs-calc{grid-template-columns:1fr}}
.rs-form{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;display:grid;gap:18px}
.rs-form label{display:grid;gap:8px;font-weight:600;font-size:15px}
.rs-form .row{display:flex;align-items:center;gap:12px}
.rs-form input[type=range]{flex:1;min-width:0;accent-color:var(--primary)}
.rs-form input[type=number],.rs-form select{width:100%;min-height:46px;line-height:1.4;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font:500 16px var(--font);background:#fff;color:var(--text)}
.rs-form output{min-width:52px;text-align:center;font-weight:700;background:var(--cloud);border-radius:8px;padding:6px 8px;direction:ltr}
.rs-form .hint{font-weight:400;font-size:13.5px;color:var(--muted)}
.rs-result{background:var(--navy);color:#fff;border-radius:var(--radius);padding:24px}
.rs-result .total{font-size:clamp(34px,5vw,46px);font-weight:700;letter-spacing:-.02em;margin-top:6px;direction:ltr;unicode-bidi:isolate;display:block;text-align:start}
.rs-result .total small{font-size:18px;font-weight:600;color:rgba(255,255,255,.75);margin-inline-start:6px}
.rs-result dl{margin-top:18px;display:grid;grid-template-columns:1fr auto;gap:8px 16px;font-size:15px}
.rs-result dt{color:rgba(255,255,255,.75)}
.rs-result dd{text-align:end;font-weight:600;direction:ltr;unicode-bidi:isolate}
.rs-result .fine{margin-top:16px;font-size:13.5px;color:rgba(255,255,255,.7)}
.rs-result .btn{margin-top:18px;width:100%}
.rs-unit{margin-top:14px;font-size:15px;color:var(--muted)}

/* Region price table (pricing section): "from" prices per region, the calculator's region highlighted */
.rs-region-note{max-width:760px;margin:0 auto 16px;text-align:center;font-size:16px;color:var(--text);font-weight:500}
.rs-prices-wrap{margin-bottom:24px}
.rs-prices td{white-space:nowrap}
.rs-prices tr.on td{background:var(--ice)}
@media (max-width:700px){.rs-prices td[data-label]::before{content:attr(data-label) ": ";color:var(--muted);font-weight:500}.rs-prices td{white-space:normal}}
.rs-form select{padding-block:0;height:48px;line-height:normal}