/* Winmotor 2026 · Portal cliente */
.portal-main{max-width:1440px;margin:0 auto;padding:clamp(34px,5vw,72px) var(--gutter) 110px}
.auth-wrap{min-height:calc(100svh - 78px);display:grid;place-items:center;padding:40px var(--gutter) 90px}
.auth-card{width:min(520px,100%);background:var(--surface);border:1px solid var(--line);border-radius:30px;padding:clamp(26px,4vw,46px);box-shadow:0 30px 90px rgba(20,8,28,.10)}
.auth-card .page-label{display:block;color:var(--flame);margin-bottom:14px}
.auth-card h1{margin:0;font-size:clamp(44px,6vw,70px);line-height:.9;letter-spacing:-.065em}
.auth-card h1 em{font-style:normal;font-weight:350;color:var(--purple-ink)}
.auth-card>p{color:var(--muted);line-height:1.7;font-size:13px;max-width:430px}
.auth-form{margin-top:30px;display:grid;gap:18px}
.auth-actions{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;margin-top:2px}
.auth-submit{width:100%;justify-content:space-between}
.password-field{position:relative}
.password-field input{padding-right:82px}
.password-toggle{position:absolute;right:0;bottom:10px;border:0;background:none;color:var(--purple-ink);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;padding:4px}
.auth-help{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--line);color:var(--muted-2);font-size:10px;line-height:1.6}
.form-error{display:none;margin:2px 0 0;padding:12px 14px;border-radius:14px;background:rgba(255,72,30,.09);color:#ad3418;font-size:11px;line-height:1.5}
.form-error.is-visible{display:block}
.header-client{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.header-client .button-small{background:transparent;color:var(--ink);border-color:var(--line);box-shadow:none}
.header-client .button-small:hover{background:var(--purple);color:#fff;border-color:var(--purple)}
.header-client .client-avatar{width:20px;height:20px;border-radius:50%;background:var(--flame);color:#fff;display:grid;place-items:center;font-size:8px;font-weight:900}
.portal-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.62fr);gap:30px;align-items:end;padding:20px 0 34px;border-bottom:1px solid var(--line)}
.portal-kicker{display:flex;align-items:center;gap:9px;color:var(--flame);font-size:10px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.portal-kicker::before{content:"";width:7px;height:7px;background:var(--flame);border-radius:50%}
.portal-hero h1{margin:0;font-size:clamp(44px,6vw,76px);line-height:.9;letter-spacing:-.065em}
.portal-hero h1 em{font-style:normal;font-weight:350;color:var(--purple-ink)}
.portal-hero p{margin:16px 0 0;color:var(--muted);font-size:13px;line-height:1.7;max-width:670px}
.portal-meta{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.portal-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:9px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.portal-chip strong{color:var(--flame)}
.portal-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:18px;margin-top:22px}
.portal-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:23px;box-shadow:0 12px 45px rgba(20,8,28,.06)}
.portal-card.dark{background:#0a0a0b;color:#fff;border-color:#0a0a0b}
.portal-card h2{margin:0;font-size:24px;line-height:1;letter-spacing:-.05em}
.portal-card .card-subtitle{margin:8px 0 0;color:var(--muted);font-size:11px;line-height:1.55}
.dark .card-subtitle{color:#bbb4bd}
.portal-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.status-dot{display:inline-flex;align-items:center;gap:7px;color:#4f8d69;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.status-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:#63b47d;box-shadow:0 0 0 5px rgba(99,180,125,.12)}
.ticket-list{display:grid;gap:8px;margin-top:18px}
.ticket{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:13px;border-radius:15px;background:var(--surface-2);border:1px solid transparent}
.ticket:hover{border-color:var(--line)}
.ticket-icon{width:31px;height:31px;border-radius:10px;background:var(--purple);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900}
.ticket strong{display:block;font-size:11px}.ticket small{display:block;margin-top:3px;color:var(--muted);font-size:9px}
.ticket-status{font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;padding:6px 8px;border-radius:999px;background:rgba(99,180,125,.11);color:#4d8b67}
.ticket-status.pending{background:rgba(255,72,30,.10);color:#b43a21}.ticket-status.closed{background:rgba(49,16,71,.10);color:var(--purple)}
.message-list{display:flex;flex-direction:column;gap:12px;margin-top:18px;max-height:410px;overflow:auto;padding-right:4px}
.chat-message{max-width:86%;padding:14px 15px;border-radius:17px 17px 17px 5px;background:var(--surface-2);border:1px solid var(--line)}
.chat-message.me{align-self:flex-end;border-radius:17px 17px 5px 17px;background:var(--purple);color:#fff;border-color:var(--purple)}
.chat-message p{margin:0;font-size:12px;line-height:1.6}.chat-message small{display:block;margin-top:7px;font-size:8px;color:var(--muted-2)}
.chat-message.me small{color:#d6c9dc}
.message-compose{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:15px}
.message-compose textarea{width:100%;min-height:86px;padding:13px 14px;background:var(--surface-2);border:1px solid var(--line);border-radius:15px;resize:vertical;color:var(--ink);outline:none}
.message-compose textarea:focus{border-color:var(--flame);box-shadow:0 0 0 4px rgba(255,72,30,.09)}
.message-send{align-self:stretch;min-width:128px}
.portal-side-stack{display:grid;gap:18px}
.portal-stat{display:flex;justify-content:space-between;align-items:end;gap:20px;padding:15px 0;border-top:1px solid rgba(255,255,255,.14)}
.portal-stat:first-child{padding-top:0;border-top:0}.portal-stat span{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#aaa2ad}.portal-stat strong{font-size:20px;letter-spacing:-.05em}
.portal-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}
.portal-actions a{min-height:48px;padding:12px;border:1px solid var(--line);border-radius:14px;display:flex;justify-content:space-between;align-items:center;background:var(--surface-2);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;transition:.2s ease}
.portal-actions a:hover{transform:translateY(-2px);border-color:var(--flame);color:var(--flame)}
.portal-empty{padding:20px;border:1px dashed var(--line);border-radius:15px;color:var(--muted);font-size:11px;line-height:1.6}
.portal-privacy{margin-top:20px;color:var(--muted-2);font-size:9px;line-height:1.6}
@media (max-width:1100px){.portal-hero{grid-template-columns:1fr}.portal-meta{justify-content:flex-start}.portal-grid{grid-template-columns:1fr}.portal-side-stack{grid-template-columns:1fr 1fr}}
@media (max-width:780px){.header-client .client-avatar{display:none}.portal-main{padding-top:26px}.portal-side-stack{grid-template-columns:1fr}.portal-card{padding:19px}.message-compose{grid-template-columns:1fr}.message-send{min-height:48px}.auth-wrap{padding-top:28px}}
@media (max-width:560px){.portal-hero h1{font-size:48px}.portal-actions{grid-template-columns:1fr}.ticket{grid-template-columns:auto 1fr}.ticket-status{grid-column:2;justify-self:start}.auth-card{border-radius:24px;padding:24px}}


/* Portal readability layer */
.auth-card,.portal-card{background:var(--surface);border-color:var(--line);color:var(--ink)}
.auth-card>p,.auth-help,.portal-card .card-subtitle,.portal-hero p,.portal-empty,.portal-privacy{color:var(--muted)}
.portal-chip{background:var(--surface-2);border-color:var(--line);color:var(--ink-soft)}
.ticket{background:var(--surface-2);border-color:transparent;color:var(--ink)}
.ticket small{color:var(--muted)}
.ticket-status.closed{color:var(--purple-ink)}
.message-compose textarea{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .portal-card{background:var(--surface);border-color:var(--line);color:var(--ink);box-shadow:0 20px 65px rgba(0,0,0,.24)}
html[data-theme="dark"] .auth-help{color:var(--muted-2)}
html[data-theme="dark"] .auth-card>p,
html[data-theme="dark"] .portal-card .card-subtitle,
html[data-theme="dark"] .portal-hero p,
html[data-theme="dark"] .portal-empty,
html[data-theme="dark"] .portal-privacy{color:var(--muted)}
html[data-theme="dark"] .portal-chip{background:var(--surface-2);color:var(--ink-soft);border-color:var(--line)}
html[data-theme="dark"] .ticket{background:var(--surface-2);color:var(--ink);border-color:transparent}
html[data-theme="dark"] .ticket:hover{border-color:var(--line-strong)}
html[data-theme="dark"] .ticket small{color:var(--muted)}
html[data-theme="dark"] .chat-message{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .chat-message small{color:var(--muted-2)}
html[data-theme="dark"] .portal-stat{border-color:rgba(255,255,255,.14)}
html[data-theme="dark"] .portal-card.dark .portal-stat span{color:#aaa2ad}
html[data-theme="dark"] .portal-actions a{background:#1b171d;border-color:rgba(255,255,255,.14);color:#f7f4f8}
html[data-theme="dark"] .portal-actions a:hover{border-color:var(--flame);color:var(--flame-ink)}

/* Final semantic contrast layer for the private portal. */
.auth-wrap,.portal-main{background:var(--paper);color:var(--ink)}
.auth-card,.portal-card{background:var(--surface);color:var(--ink);border-color:var(--line)}
.auth-card>p,.auth-help,.portal-hero p,.portal-card .card-subtitle,.portal-empty,.portal-privacy,.consent{color:var(--muted)}
.form-error{background:color-mix(in srgb,var(--flame) 11%,transparent);color:var(--warning)}
.portal-chip,.ticket,.portal-actions a,.message-compose textarea{background:var(--surface-2);color:var(--ink-soft);border-color:var(--line)}
.ticket small,.chat-message small,.portal-stat span{color:var(--muted)}
.chat-message{background:var(--surface-2);color:var(--ink);border-color:var(--line)}
.chat-message.me{background:var(--purple);color:#fff;border-color:var(--purple)}
.message-compose textarea{color:var(--ink)}
.password-toggle,.portal-actions a:hover{color:var(--purple-ink)}
.portal-actions a:hover{border-color:var(--flame);color:var(--flame-ink)}
