/* Shared parts of the TR Linux / Windows / Ryzen VPS sections (templates/service-*-sections.php):
   option buttons, labels, tags, notes, expandable tables, link rows. Page styles: service-<kind>.css. */
.svc-custom{--x-green:#163c2c;--x-soft:#f3f6f0;--x-pale:#ecf3e8;--x-line:#d6dfd3;--x-edge:#b9d0b1;--x-muted:#5e6b61;--x-label:#3c6149}
.svc-page .svc-x-soft{background:#eef3eb}
.svc-x-label{margin:0;font:600 10px/1.6 'JetBrains Mono',monospace;letter-spacing:.07em;text-transform:uppercase;color:var(--x-label)}
.svc-x-note{max-width:900px;margin:18px 0 0;font-size:11px;line-height:1.8;color:#64725e}

/* Option buttons. Without JS every option is listed and the buttons stay hidden. */
.svc-x-tabs{display:none;flex-wrap:wrap;gap:8px;margin-bottom:20px}
[data-picker].is-ready .svc-x-tabs{display:flex}
[data-picker] [hidden]{display:none!important}
.svc-x-tab{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:9px 16px;border:1px solid #c8d6c5;border-radius:999px;background:#fff;color:#2d3d31;font:600 13px/1.35 var(--sans,'Inter',sans-serif);text-align:left;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.svc-x-tab small{display:block;font:500 10px/1.4 'JetBrains Mono',monospace;color:#6b786c}
.svc-x-tab:hover{border-color:#5d8968}
.svc-x-tab[aria-pressed=true]{background:var(--x-green);border-color:var(--x-green);color:#fff}
.svc-x-tab[aria-pressed=true] small{color:#cfe3cf}
.svc-x-tab:focus-visible{outline:2px solid #1f7345;outline-offset:3px}

.svc-x-tags{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0;list-style:none}
.svc-x-tags li{padding:5px 10px;border:1px solid #c8d6c5;background:#fff;font:10px/1.5 'JetBrains Mono',monospace;color:#3f5544}
.svc-x-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:26px}
.svc-x-cards>div{padding-top:18px;border-top:2px solid #b7cab4}
.svc-page .svc-x-cards h3{margin:0 0 7px;font-size:14px}
.svc-x-cards p{margin:0;font-size:12px;line-height:1.8;color:#6a7569}
.svc-x-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 24px;margin-top:24px}

/* Expandable data table (details/summary works without JS). */
.svc-x-details{margin-top:24px;border:1px solid var(--x-line);background:#fff}
.svc-x-details>summary{display:flex;justify-content:space-between;gap:16px;padding:16px 20px;font-size:13px;font-weight:600;color:var(--x-green);cursor:pointer;list-style:none}
.svc-x-details>summary::-webkit-details-marker{display:none}
.svc-x-details>summary::after{content:'+';font:400 18px/1 'JetBrains Mono',monospace}
.svc-x-details[open]>summary::after{content:'−'}
.svc-x-details>summary:focus-visible{outline:2px solid #1f7345;outline-offset:-2px}
.svc-x-table{width:100%;border-collapse:collapse;border-top:1px solid var(--x-line)}
.svc-x-table thead th{padding:14px 20px;background:var(--x-green);color:#fff;font-size:11px;font-weight:500;text-align:left}
.svc-x-table tbody th,.svc-x-table td{padding:16px 20px;border-bottom:1px solid #e0e8dc;font-size:12px;line-height:1.75;text-align:left;vertical-align:top}
.svc-x-table tbody th{width:24%;font-weight:600;color:#183d27}
.svc-x-table tbody tr:last-child>*{border-bottom:0}

@media(max-width:760px){
.svc-x-tab{flex:1 1 calc(50% - 8px);min-height:48px;padding:9px 12px;border-radius:12px;font-size:12px}
.svc-x-cards{grid-template-columns:1fr;gap:15px}
.svc-x-table thead{display:none}
.svc-x-table tr{display:block;padding:16px 18px;border-bottom:1px solid #e0e8dc}
.svc-x-table tbody tr:last-child{border-bottom:0}
.svc-x-table tbody th,.svc-x-table td{display:block;width:auto;padding:0;margin-top:10px;border:0}
.svc-x-table tbody th{margin-top:0;font-size:14px}
.svc-x-table td::before{content:attr(data-label);display:block;margin-bottom:2px;font:700 10px/1.5 'JetBrains Mono',monospace;color:#687963;text-transform:uppercase}
}
@media(prefers-reduced-motion:reduce){.svc-x-tab{transition:none}}
