/* =============================================================================
   Cloud Acropolis Accounting Portal
   -----------------------------------------------------------------------------
   Every class name from the previous stylesheet is kept, so no template needs
   to change. What changes is the weight of the thing: a slimmer navigation
   rail, hairline rules instead of boxed borders, and figures set in tabular
   numerals so columns of money line up on the decimal.

   The people using this are shop owners and their accountants, reading
   numbers. So the numbers get the attention and everything else stays quiet.
   ========================================================================== */

:root {
    --ink:          #0E1A2D;
    --ink-soft:     #5a6675;
    --ink-faint:    #8b96a3;
    --rail:         #0E1A2D;
    --rail-active:  #206C62;
    --surface:      #ffffff;
    --canvas:       #f5f7fa;
    --line:         #e3e8ee;
    --line-strong:  #cfd7e0;
    --accent:       #206C62;
    --accent-hover: #17504A;
    --pos:          #1a7a34;
    --neg:          #b3261e;
    --warn:         #a06d00;

    --radius:       8px;
    --radius-sm:    5px;
}

*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    overflow-x: hidden;
    background: var(--canvas);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter,
                 Roboto, Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

/* Money and quantities line up on the decimal. */
.data-table td, .data-table th, .num, input[type="number"], .sheet {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

/* ── Login ────────────────────────────────────────────────────────────── */
.login-body {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 60px 24px 24px;
    background: var(--canvas);
}

.login-card {
    width: 100%;
    max-width: 380px;
    padding: 40px 36px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(22, 32, 46, .04),
                0 8px 24px rgba(22, 32, 46, .06);
}

.login-card h1 {
    margin: 0 0 4px;
    font-size: 24px;
    font-weight: 650;
    letter-spacing: -.01em;
}

.subtitle { margin: 0 0 28px; color: var(--ink-soft); font-size: 14px; }

.login-card label {
    display: block;
    margin: 18px 0 6px;
    font-weight: 550;
    font-size: 13px;
    color: var(--ink-soft);
}

.login-card input {
    width: 100%;
    padding: 10px 12px;
    font-size: 15px;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
}

.login-card input:focus,
.form-field input:focus,
select:focus, input:focus {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
    border-color: var(--accent);
}

.login-card button {
    width: 100%;
    margin-top: 24px;
    padding: 11px 16px;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: var(--accent);
    border: 0;
    border-radius: var(--radius-sm);
    cursor: pointer;
}

.login-card button:hover { background: var(--accent-hover); }

.error-box {
    margin-top: 18px;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--neg);
    background: #fdf2f1;
    border: 1px solid #f5d5d2;
    border-radius: var(--radius-sm);
}

/* ── Shell ────────────────────────────────────────────────────────────── */
.layout { display: flex; min-height: 100vh; margin-top: 36px; }

.sidebar {
    display: flex;
    flex-direction: column;
    flex: 0 0 216px;
    width: 216px;
    padding: 20px 0 16px;
    background: var(--rail);
    color: #dde3ec;
}

.sidebar-brand { padding: 0 20px 22px; }

.sidebar-logo {
    display: block;
    width: 120px;
    max-width: 100%;
    height: auto;
    background: #fff;
    padding: 8px 10px;
    border-radius: var(--radius-sm);
}

.sidebar-company {
    margin-top: 14px;
    font-size: 12px;
    font-weight: 550;
    line-height: 1.35;
    color: #9fb0c6;
}

.sidebar-title {
    padding: 0 20px 20px;
    font-size: 18px;
    font-weight: 650;
}

.sidebar a {
    display: block;
    padding: 9px 20px;
    font-size: 14.5px;
    color: #c9d4e2;
    text-decoration: none;
    border-left: 3px solid transparent;
}

.sidebar a:hover { background: rgba(255, 255, 255, .06); color: #fff; }

.sidebar a.active {
    color: #fff;
    font-weight: 600;
    background: rgba(255, 255, 255, .09);
    border-left-color: var(--rail-active);
}

.sidebar-spacer { flex-grow: 1; }

.logout-link { font-size: 13.5px; opacity: .7; }
.logout-link:hover { opacity: 1; }

.content {
    flex-grow: 1;
    padding: 36px 40px 64px;
    max-width: 1100px;
}

.content h1 {
    margin: 0 0 24px;
    font-size: 26px;
    font-weight: 650;
    letter-spacing: -.015em;
}

.content h2 {
    margin: 34px 0 14px;
    font-size: 17px;
    font-weight: 620;
    letter-spacing: -.005em;
}

/* ── Cards and forms ──────────────────────────────────────────────────── */
.form-card {
    padding: 20px 22px;
    margin-bottom: 22px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.form-row {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.form-field { flex: 1; min-width: 160px; }

.form-field label,
.form-card label {
    display: inline-block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 550;
    color: var(--ink-soft);
}

.form-field input,
.form-card input,
.form-card select,
input[type="date"], input[type="text"], input[type="number"], select {
    padding: 8px 11px;
    font-size: 14.5px;
    font-family: inherit;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
}

.form-field input { width: 100%; }

/* ── Buttons ──────────────────────────────────────────────────────────── */
.btn-primary, .btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 15px;
    font-size: 14.5px;
    font-family: inherit;
    font-weight: 600;
    border-radius: var(--radius-sm);
    cursor: pointer;
    text-decoration: none;
}

.btn-primary {
    color: #fff;
    background: var(--accent);
    border: 1px solid var(--accent);
}

.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }

.btn-secondary {
    color: var(--accent);
    background: var(--surface);
    border: 1px solid var(--line-strong);
}

.btn-secondary:hover { border-color: var(--accent); background: #f4f7fb; }

/* ── Tables ───────────────────────────────────────────────────────────── */
.data-table, table {
    width: 100%;
    margin-bottom: 22px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

.data-table th, table th {
    padding: 11px 14px;
    font-size: 12px;
    font-weight: 650;
    color: var(--ink-soft);
    background: #fafbfd;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
}

.data-table td, table td {
    padding: 11px 14px;
    font-size: 14.5px;
    border-bottom: 1px solid var(--line);
}

.data-table tbody tr:last-child td,
table tbody tr:last-child td { border-bottom: 0; }

.data-table tbody tr:hover td { background: #fafbfd; }

.data-table tfoot th {
    background: #fafbfd;
    border-top: 1px solid var(--line-strong);
    border-bottom: 0;
    font-size: 14px;
    color: var(--ink);
}

/* ── Status pills ─────────────────────────────────────────────────────── */
.pill {
    display: inline-block;
    padding: 3px 9px;
    font-size: 12.5px;
    font-weight: 600;
    border-radius: 999px;
}

.pill-posted { background: #e8f5ec; color: var(--pos); }
.pill-cancel { background: #fdf2f1; color: var(--neg); }
.pill-draft  { background: #fdf6e6; color: var(--warn); }

/* ── Messages ─────────────────────────────────────────────────────────── */
.success-box, .error-box-inline {
    padding: 12px 14px;
    margin-bottom: 20px;
    font-size: 14px;
    border-radius: var(--radius-sm);
}

.success-box {
    color: var(--pos);
    background: #e8f5ec;
    border: 1px solid #cfe7d6;
}

.error-box-inline {
    color: var(--neg);
    background: #fdf2f1;
    border: 1px solid #f5d5d2;
}

/* ── Sheet ────────────────────────────────────────────────────────────── */
.sheet {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
}

/* ── Small screens ────────────────────────────────────────────────────── */
.menu-toggle { display: none; }
@media (max-width: 820px) {
    body { font-size: 17px; }
    .data-table td, table td, .data-table th, table th, .form-field input, .form-card input, .form-card select, input, select, .btn-primary, .btn-secondary, .sidebar a { font-size: 17px; }
    .hide-mobile-header { display: none !important; }
    .stack-mobile, .stack-mobile tbody, .stack-mobile tr { display: block; width: 100%; }
    .stack-mobile td { display: block; width: 100%; padding: 6px 14px; border-bottom: none; }
    .stack-mobile td[data-label]::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 650; color: var(--ink-soft); margin-bottom: 4px; }
    .stack-mobile td input, .stack-mobile td select { width: 100%; }
    .stack-mobile thead { display: none; }
    .menu-toggle { display: block; position: fixed; top: 4px; left: 8px; z-index: 1001; background: none; border: none; color: #fff; font-size: 22px; padding: 0; }
    .sidebar { display: none; }
    .layout.sidebar-open .sidebar { display: flex; position: fixed; top: 0; left: 0; right: 0; z-index: 1000; flex-direction: column; align-items: flex-start; background: var(--rail); padding-top: 40px; }
    .layout { flex-direction: column; }

    .sidebar {
        flex: 0 0 auto;
        width: 100%;
        flex-direction: row;
        align-items: center;
        overflow-x: auto;
        padding: 6px 8px;
    }

    .sidebar-brand, .sidebar-title, .sidebar-spacer { display: none; }

    .sidebar a {
        padding: 11px 14px;
        white-space: nowrap;
        border-left: 0;
        border-bottom: 3px solid transparent;
    }

    .sidebar a.active { border-left: 0; border-bottom-color: var(--rail-active); }

    .content { padding: 64px 18px 48px; }

    /* Tables scroll sideways rather than restack: a table set to
       display:block loses its row structure entirely. */
    .content { overflow-x: auto; }
    .data-table, table { min-width: 560px; }
    .stack-mobile { min-width: 0 !important; }
}

@media (prefers-reduced-motion: reduce) {
    * { animation: none !important; transition: none !important; }
}

/* ── Staff Hours sheet ────────────────────────────────────────────────────
   A spreadsheet-like list: each employee is a row that expands into their
   entries. The summary row and its header share one grid so the columns
   line up. */
.sheet-header,
.sheet-row-summary {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 12px;
    padding: 10px 16px;
}

.sheet-header {
    font-size: 12px;
    font-weight: 650;
    color: var(--ink-soft);
    background: #fafbfd;
    border-bottom: 1px solid var(--line);
}

.sheet-row-summary {
    font-size: 14.5px;
    cursor: pointer;
    border-bottom: 1px solid var(--line);
    list-style: none;
}

.sheet-row-summary::-webkit-details-marker { display: none; }
.sheet-row-summary:hover { background: #fafbfd; }

details[open] > .sheet-row-summary {
    font-weight: 600;
    background: #f2f6fb;
}

.sheet-detail {
    padding: 14px 16px 20px;
    background: #fbfcfd;
    border-bottom: 1px solid var(--line);
}

.sheet-detail table {
    width: 100%;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    font-size: 14px;
}

.sheet-detail th,
.sheet-detail td {
    padding: 7px 10px;
    text-align: left;
    border-bottom: 1px solid var(--line);
}

.sheet-detail input {
    width: 100%;
    padding: 6px 8px;
    font-size: 14px;
}

/* ── Login page ──────────────────────────────────────────────────────── */
.login-body {
    background: linear-gradient(160deg, #1b2740 0%, #2b4c7e 100%);
}

.login-card { text-align: center; padding: 44px 38px; }

.login-logo {
    display: block;
    max-width: 190px;
    height: auto;
    margin: 0 auto 22px;
}

.login-card form { text-align: left; }

/* Top language switcher bar */
.topbar-lang {
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    width: 100%;
    background: var(--rail);
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    padding: 0 16px;
}
.topbar-lang a {
    color: #cfd8e3;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 14px;
    border-bottom: 3px solid transparent;
}
.topbar-lang a:hover {
    color: #ffffff;
}
.topbar-lang a.active {
    color: #ffffff;
    border-bottom-color: var(--rail-active);
}

/* Help menu dropdown */
.help-menu {
    position: relative;
    display: flex;
    align-items: center;
}
.help-toggle {
    background: transparent;
    border: 2px solid #cfd8e3;
    color: #cfd8e3;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    line-height: 1;
    margin-right: 12px;
}
.help-toggle:hover {
    color: #ffffff;
    border-color: #ffffff;
}
.help-dropdown {
    display: none;
    position: absolute;
    top: 32px;
    right: 0;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    min-width: 200px;
    z-index: 2000;
    padding: 6px 0;
}
.help-dropdown.open {
    display: block;
}
.topbar-lang .help-dropdown a {
    display: block;
    padding: 10px 16px;
    color: #223047;
    text-decoration: none;
    font-size: 14px;
}
.topbar-lang .help-dropdown a:hover {
    background: #f2f6fb;
    color: #66B9E5;

}
a.logout-icon-btn {
    font-size: 22px;
    color: #cfd8e3;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    width: 22px;
    height: 22px;
    margin-left: 4px;
    margin-right: 4px;
    cursor: pointer;
    text-decoration: none;
}
.logout-icon-btn svg {
    width: 20px;
    height: 20px;
}
a.logout-icon-btn:hover {
    opacity: 0.75;
}

.site-footer {
    margin-top: 32px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    font-size: 12px;
    color: var(--ink-faint);
    text-align: center;
}

/* ---- FiscFort portal additions ---- */
.form-field { margin-bottom: 16px; }
.form-field label { display: block; margin-bottom: 6px; }
.form-field input[type="text"], .form-field textarea {
    width: 100%; box-sizing: border-box; padding: 10px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    background: var(--surface); color: var(--ink); font: inherit;
}
.form-field textarea { min-height: 150px; resize: vertical; }
.form-field input[type="text"]:focus, .form-field textarea:focus {
    outline: none; border-color: var(--accent);
}
details > summary { cursor: pointer; margin: 14px 0 10px; color: var(--accent); font-weight: 600; }
.msg { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm);
       padding: 10px 14px; margin-bottom: 8px; }
.msg.staff { border-left: 3px solid var(--accent); }
.msg-head { font-size: 12px; color: var(--ink-soft); margin-bottom: 4px; }
.msg-body { white-space: pre-wrap; font-size: 14px; line-height: 1.45; }
.msg-att { font-size: 13px; margin-top: 6px; }
.reply-box { margin-bottom: 16px; }
.reply-box textarea { width: 100%; box-sizing: border-box; min-height: 70px; resize: vertical;
       padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); font: inherit; }
.reply-box textarea:focus { outline: none; border-color: var(--accent); min-height: 140px; }
.reply-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; font-size: 13px; }
.form-field select { width: 100%; box-sizing: border-box; padding: 9px 10px; border: 1px solid var(--line-strong);
       border-radius: var(--radius-sm); background: var(--surface); font: inherit; }
.plans { display: grid; grid-template-columns: repeat(auto-fill, minmax(460px, 1fr)); gap: 16px; }
.plan { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); margin: 0; }
.plan h2 { margin: 0; padding: 12px 16px; background: var(--canvas); border-bottom: 1px solid var(--line);
       font-size: 17px; border-radius: var(--radius) var(--radius) 0 0; }
.plan-body { display: flex; gap: 16px; padding: 14px 16px; }
.plan-feat { flex: 1; margin: 0; padding-left: 18px; font-size: 13px; }
.plan-feat li { margin-bottom: 7px; }
.plan-feat small { color: var(--ink-soft); }
.plan-buy { width: 180px; text-align: center; display: flex; flex-direction: column; gap: 6px; }
.plan-price { font-size: 22px; font-weight: 600; color: var(--ink); }
.plan-buy select, .plan-buy input { width: 100%; box-sizing: border-box; padding: 6px 8px; font: inherit; font-size: 13px;
       border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); }
@media (max-width: 700px) { .plans { grid-template-columns: 1fr; } .plan-body { flex-direction: column; } .plan-buy { width: auto; } }
.content:has(.plans) { max-width: none; }
.plan h2 { background: var(--rail); color: #fff; border-bottom: none; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 700px) { .grid2 { grid-template-columns: 1fr; } }
.form-field input[type="password"], .form-field input:disabled { width: 100%; box-sizing: border-box; padding: 10px 12px;
       border: 1px solid var(--line-strong); border-radius: var(--radius-sm); font: inherit; background: var(--surface); }
.form-field input:disabled { background: var(--canvas); color: var(--ink-soft); }
/* ---- compact forms ---- */
.grid2 { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 14px; }
.form-card { padding: 16px 20px; }
.form-card h2 { margin: 0 0 12px; font-size: 17px; }
.form-field { margin-bottom: 10px; }
.form-field label { margin-bottom: 3px; font-size: 12px; }
.form-field input[type="text"], .form-field input[type="password"], .form-field input:disabled,
.form-field select { padding: 6px 10px; font-size: 14px; }
.signup-card { max-width: 820px; width: 100%; }
.signup-card .form-field input { width: 100%; box-sizing: border-box; }
label.check { display: block; margin: 8px 0; font-size: 13px; }
/* ---- compact login ---- */
.login-card { padding: 22px 28px; max-width: 380px; }
.login-card.signup-card { max-width: 820px; }
.login-logo { max-width: 110px; height: auto; display: block; margin: 0 auto 6px; }
.login-card h1 { font-size: 20px; margin: 4px 0; }
.login-card .subtitle { margin: 0 0 12px; font-size: 13px; }
.login-card label { font-size: 12px; margin: 8px 0 3px; display: block; }
.login-card input[type="email"], .login-card input[type="password"], .login-card input[type="text"] { padding: 7px 10px; font-size: 14px; }
.login-card button { margin-top: 12px; padding: 9px; }
.login-card label.check { display: flex; align-items: center; gap: 8px; margin: 8px 0; font-size: 13px; text-align: left; }
.login-card label.check input[type="checkbox"] { width: auto; margin: 0; padding: 0; flex: none; outline: none; }

/* ---- services list + spreadsheet-style forms ---- */
.content:has(.svc-list), .content:has(.grid-form) { max-width: none; }
.grid-h { margin: 22px 0 8px; font-size: 13px; font-weight: 650; color: var(--ink-soft); }
.grid-form td { padding: 6px 8px; }
.grid-form input, .grid-form select { width: 100%; box-sizing: border-box; padding: 6px 9px; font: inherit; font-size: 14px;
    color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-sm); }
.grid-form th.act, .grid-form td.act { width: 1%; white-space: nowrap; }
.grid-form .btn-primary { padding: 6px 16px; }
@media (max-width: 820px) { .grid-form { min-width: 980px; } .svc-list { min-width: 700px; } }

/* ---- services accordion ---- */
.content:has(.svcs) { max-width: none; min-width: 0; }
.svcs { width: 100%; margin-bottom: 22px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow-x: auto; }
.svcs-head, .svc-row { display: grid; grid-template-columns: 22px minmax(180px, 2.4fr) 96px minmax(80px, 1fr) 100px 90px 120px 120px; align-items: center; gap: 0 14px; padding: 11px 16px; }
.svcs-head { font-size: 12px; font-weight: 650; color: var(--ink-soft); background: #fafbfd; border-bottom: 1px solid var(--line); }
details.svc + details.svc { border-top: 1px solid var(--line); }
details.svc > summary { list-style: none; cursor: pointer; font-size: 14.5px; }
details.svc > summary::-webkit-details-marker { display: none; }
details.svc > summary:hover { background: #fafbfd; }
details.svc[open] > summary { background: #fafbfd; border-bottom: 1px solid var(--line); }
.chev::before { content: "\25B8"; color: var(--ink-soft); }
details[open] > summary .chev::before { content: "\25BE"; }
.svc-body { padding: 6px 18px 20px; }
.grid-h { margin: 18px 0 8px; font-size: 13px; font-weight: 650; color: var(--ink-soft); }
.tscroll { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 6px; }
.grid-form { width: 100%; margin: 0; border: 0; border-radius: 0; overflow: visible; }
.grid-form th { padding: 9px 10px; text-align: left; white-space: nowrap; }
.grid-form td { padding: 6px 8px; white-space: nowrap; }
.grid-form input, .grid-form select { width: 100%; box-sizing: border-box; min-width: 140px; padding: 6px 9px; font: inherit; font-size: 14px; color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-sm); }
.grid-form .w-xs { min-width: 80px; }
.grid-form .w-l { min-width: 200px; }
.grid-form .w-xl { min-width: 260px; }
.grid-form td.role { font-weight: 550; }
.grid-form th.act, .grid-form td.act { position: sticky; right: 0; width: 1%; background: var(--surface); box-shadow: -6px 0 6px -6px rgba(15, 23, 42, .2); }
.grid-form th.act { background: #fafbfd; }
.grid-form .btn-primary { padding: 6px 18px; }
@media (max-width: 900px) { .svcs-head, .svc-row { min-width: 860px; } }

/* ---- services lazy rows ---- */
.svc + .svc { border-top: 1px solid var(--line); }
a.svc-row { color: inherit; text-decoration: none; font-size: 14.5px; cursor: pointer; }
a.svc-row:hover { background: #fafbfd; }
.svc.open > a.svc-row { background: #fafbfd; border-bottom: 1px solid var(--line); }
.svc.open .chev::before { content: "\25BE"; }

/* ---- bundle tenants ---- */
.tens { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow-x: auto; margin-bottom: 6px; }
.ten + .ten { border-top: 1px solid var(--line); }
a.ten-row { display: grid; grid-template-columns: 22px 110px minmax(220px, 1fr) minmax(220px, 1fr); gap: 0 14px; align-items: center; padding: 9px 14px; color: inherit; text-decoration: none; font-size: 14px; cursor: pointer; }
a.ten-row:hover { background: #fafbfd; }
.ten.open > a.ten-row { background: #fafbfd; border-bottom: 1px solid var(--line); }
.ten.open .chev::before { content: "\25BE"; }
.ten-body { padding: 4px 16px 18px; }
@media (max-width: 900px) { a.ten-row { min-width: 700px; } }

/* Cookie banner */
.cookie-banner { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 1000; max-width: 640px; margin: 0 auto; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 30px rgba(14,26,45,0.18); padding: 1rem 1.25rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; font-size: 0.9rem; }
.cookie-banner[hidden] { display: none; }
.cookie-banner p { margin: 0; flex: 1 1 260px; }
.cookie-banner a { color: var(--accent); }
.cookie-banner__actions { display: flex; gap: 0.5rem; flex: 0 0 auto; }