/* STEVAR Client Portal 1.1 — accessible, mobile-first enterprise UI */
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#302b32;background:#f8f6f5;font-synthesis:none;--wine:#741b39;--wine-strong:#581128;--wine-light:#faedf1;--ink:#2e2930;--muted:#746c74;--border:#eae2e5;--paper:#fff;--success:#14694e;--success-bg:#e7f6ed;--warn:#875710;--warn-bg:#fff4dc;--danger:#a92c3c;--danger-bg:#fdecef;--info:#315ca8;--info-bg:#eaf1ff;--shadow:0 9px 30px rgba(62,30,46,.055)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh}body,button,input,textarea,select{font-family:inherit}button,input,select,textarea{font-size:14px}[hidden]{display:none!important}a{color:var(--wine);text-underline-offset:3px}button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 17px;min-height:43px;border:1px solid transparent;border-radius:11px;background:var(--wine);color:#fff;font-weight:700;line-height:1.3;text-decoration:none;cursor:pointer;transition:background .14s ease,box-shadow .14s ease,border-color .14s ease,transform .14s ease}button:hover:not(:disabled),.btn:hover{background:var(--wine-strong)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.5;cursor:wait}button.secondary,.secondary{background:#f7f2f4;color:var(--wine);border-color:#ebdce2}button.secondary:hover,.secondary:hover{background:#f0e3e9}button.danger{background:var(--danger-bg);color:var(--danger);border-color:#f8d2d8}button.danger:hover{background:#fbdce3}button.ghost{background:transparent;color:var(--wine);border-color:var(--border)}button.ghost:hover{background:var(--wine-light)}:is(a,button,input,select,textarea):focus-visible{outline:3px solid #ba7891;outline-offset:2px}input,select,textarea{width:100%;min-width:0;min-height:43px;padding:11px 12px;border:1px solid #dcd3d8;border-radius:11px;background:#fff;color:var(--ink);outline-color:var(--wine)}textarea{min-height:104px;resize:vertical}input::placeholder,textarea::placeholder{color:#9b9297}label{display:grid;gap:7px;margin:12px 0;font-size:13px;font-weight:680;color:#574c55}h1,h2,h3,p{overflow-wrap:break-word}h1{font-size:clamp(26px,3vw,35px);letter-spacing:-.045em;line-height:1.12;margin:0 0 8px}h2{font-size:20px;letter-spacing:-.022em;margin:0 0 10px}h3{font-size:16px;letter-spacing:-.012em;margin:0 0 8px}p{line-height:1.55;margin:0 0 14px}small,.muted{color:var(--muted)}.muted{font-size:13px}.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:850;letter-spacing:.12em;color:var(--wine);text-transform:uppercase;margin-bottom:10px}.skip-link{position:absolute;top:-60px;left:15px;padding:10px;background:var(--wine);color:white;z-index:100}.skip-link:focus{top:10px}
.portal-header{background:#fff;border-bottom:1px solid var(--border);position:relative;z-index:3}.header-inner{max-width:1220px;margin:auto;padding:12px 23px;display:flex;align-items:center;gap:17px;min-height:76px}.brand{display:flex;align-items:center;flex:0 0 auto}.brand img{width:154px;max-width:35vw;height:auto;display:block}.brand-divider{height:27px;width:1px;background:#e8dde2}.header-title{display:grid;gap:3px;min-width:0}.header-title strong{font-size:14px;letter-spacing:-.01em}.header-title small{font-size:11px}.role-chip{margin-left:auto;white-space:nowrap;background:var(--wine-light);color:var(--wine);border-radius:99px;padding:8px 10px;font-weight:730;font-size:11px}.btn-exit{margin-left:0;padding:9px 14px;background:#f8f5f6;border-color:var(--border);color:#6a4b59;font-size:12px;min-height:38px}.btn-exit:hover{background:var(--wine-light)!important;color:var(--wine)}#logout:not([hidden]):first-of-type{margin-left:auto}
main{max-width:1220px;margin:0 auto;min-height:calc(100vh - 170px);padding:28px 23px 42px}.card{background:var(--paper);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow);min-width:0}.card p:last-child{margin-bottom:0}.auth{max-width:460px;margin:8vh auto}.auth h1{font-size:clamp(30px,4vw,40px)}.auth form{margin:23px 0}.auth form button{width:100%;margin-top:8px}.access-help{padding-top:15px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}
.portal-tabs{display:flex;align-items:center;gap:7px;overflow-x:auto;white-space:nowrap;padding:4px 1px 12px;margin-bottom:22px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.portal-tabs button{flex:0 0 auto;white-space:nowrap;background:transparent;color:#756770;border:1px solid transparent;border-radius:11px;padding:10px 14px;min-height:43px}.portal-tabs button:hover{background:#f4ecef;color:var(--wine)}.portal-tabs button.active{color:var(--wine);background:var(--wine-light);border-color:#efcfda;box-shadow:inset 0 -2px 0 var(--wine)}.tab-glyph{font-size:17px;line-height:1}.bar{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:23px}.page-heading p{margin:0}.company-select{margin:0;min-width:240px;max-width:340px}.company-select select{border-color:#e4dadd;background:white;font-weight:660}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:15px}.grid{display:grid;grid-template-columns:minmax(255px,345px) minmax(0,1fr);gap:16px;align-items:start}.row,.actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.row{justify-content:space-between}.actions{justify-content:flex-start}.section-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:0 0 15px}.section-heading h2,.section-heading p{margin:0}.section-heading p{margin-top:4px}.section-stack{display:grid;gap:16px}.section-intro{display:grid;gap:4px;margin-bottom:17px}.section-intro p{margin:0}.section-intro h2{margin:0}.dashboard-hero{background:linear-gradient(115deg,#641832 0%,#862b48 100%);color:white;padding:28px;border-radius:20px;display:flex;justify-content:space-between;align-items:center;gap:25px;position:relative;overflow:hidden}.dashboard-hero:after{content:"";position:absolute;right:-60px;top:-100px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.055);pointer-events:none}.dashboard-hero .eyebrow,.dashboard-hero p{color:#f1dbe3}.dashboard-hero h2{font-size:clamp(22px,2.5vw,29px);margin-bottom:7px}.dashboard-hero .actions{flex:0 0 auto;position:relative;z-index:1}.dashboard-hero button{background:#fff;color:var(--wine)}.dashboard-hero button:hover{background:#f9e8ee}.dashboard-hero button.secondary{background:transparent;color:#fff;border-color:#c18097}.dashboard-hero button.secondary:hover{background:#873652}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:16px}.metric{padding:20px;border:1px solid var(--border);background:white;border-radius:17px}.metric strong{font-size:31px;line-height:1.12;display:block;color:var(--ink);letter-spacing:-.04em;margin:10px 0 5px;font-variant-numeric:tabular-nums}.metric p{font-size:12px;color:var(--muted);margin:0}.metric .metric-icon{width:31px;height:31px;display:grid;place-items:center;border-radius:9px;background:var(--wine-light);color:var(--wine);font-size:18px}.metric.warning .metric-icon{background:var(--warn-bg);color:var(--warn)}.metric.success .metric-icon{background:var(--success-bg);color:var(--success)}
.system-card{display:flex;flex-direction:column;gap:13px;min-height:230px}.system-card h3{margin:0;font-size:18px}.system-card p{color:var(--muted);font-size:13px;margin:0}.system-card .actions{margin-top:auto}.system-icon{width:39px;height:39px;border-radius:12px;background:var(--wine-light);color:var(--wine);display:grid;place-items:center;font-weight:850}.system-heading{display:flex;align-items:center;justify-content:space-between;gap:9px}.system-card a{text-decoration:none}.system-card .btn{font-size:12px}.pill,.status-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;border-radius:999px;background:#f0ecee;color:#6a5560;padding:6px 10px;font-weight:760;font-size:11px;line-height:1.1;white-space:nowrap}.status-chip.status-active,.status-chip.status-resuelto{background:var(--success-bg);color:var(--success)}.status-chip.status-demo,.status-chip.status-abierto{background:var(--warn-bg);color:var(--warn)}.status-chip.status-paused,.status-chip.status-alta{background:var(--danger-bg);color:var(--danger)}.status-chip.status-en_progreso,.status-chip.status-info{background:var(--info-bg);color:var(--info)}.empty-state{padding:30px 22px;text-align:center;border:1px dashed #dacbd2;border-radius:17px;background:#fefcfd;display:grid;justify-items:center;gap:9px}.empty-state h3,.empty-state p{margin:0}.empty-state p{font-size:13px;color:var(--muted);max-width:450px}.empty-glyph{width:48px;height:48px;border-radius:14px;background:var(--wine-light);color:var(--wine);display:grid;place-items:center;font-size:23px}
.ticket-list{display:grid;gap:8px}.ticket-item{display:grid;gap:7px;width:100%;text-align:left;padding:14px;background:white;color:var(--ink);border:1px solid var(--border);border-radius:12px;min-height:70px}.ticket-item:hover{background:#fdf9fb;color:var(--ink);border-color:#c69aae}.ticket-item.selected{background:#faf0f4;color:var(--ink);border-color:#c68da4;box-shadow:inset 3px 0 var(--wine)}.ticket-item strong{font-size:13px;line-height:1.35}.ticket-item .ticket-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.ticket-detail{min-width:0}.ticket-detail .messages{margin:15px 0}.ticket-detail form{display:grid;gap:9px}.ticket-detail form button{justify-self:start}.ticket-heading{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-bottom:11px}.ticket-heading h3{width:100%;font-size:19px;margin:0}.messages{display:flex;flex-direction:column;gap:10px;max-height:420px;min-height:210px;overflow:auto;padding:15px;border-radius:14px;background:#f8f5f6;border:1px solid #f1e9ed}.msg{max-width:86%;align-self:flex-start;background:white;border:1px solid #efe5e8;border-radius:13px 13px 13px 4px;padding:11px 14px;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}.msg.mine{align-self:flex-end;background:#f4e5eb;border-color:#ecd1dc;border-radius:13px 13px 4px 13px}.msg small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.ticket-attachments{display:grid;gap:9px;padding-top:15px;margin-top:15px;border-top:1px solid var(--border)}.ticket-attachments h3{margin:0}.ticket-attachments button,.ticket-attachments a{max-width:100%}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,335px),1fr));gap:15px}.admin-company{display:grid;gap:13px}.admin-company>.row h3{margin:0}.admin-product-list{display:flex;flex-wrap:wrap;gap:7px}.admin-product-list button{font-size:12px;padding:9px 12px;min-height:36px;background:#f6f2f4;border:1px solid var(--border);color:var(--ink)}.admin-product-list button:hover{background:var(--wine-light);color:var(--wine)}.admin-product-list button.is-assigned{background:var(--wine-light);color:var(--wine);border-color:#e6bccb}.admin-users{border-top:1px solid var(--border);padding-top:16px;display:grid;gap:13px}.admin-users>p{font-size:12px;color:var(--muted)}.admin-users .list{display:grid;gap:8px}.admin-users .row{padding:10px 12px;background:#faf8f9;border:1px solid var(--border);border-radius:10px}.admin-users form{display:grid;gap:9px}.admin-users form button{justify-self:start}.admin-users .row button{min-height:33px;padding:7px 11px}.admin-create{margin-bottom:16px}.admin-create form{display:flex;align-items:end;gap:9px;flex-wrap:wrap}.admin-create form label{flex:1;min-width:215px;margin:0}.link-result{display:grid;gap:10px;background:#f8f4f6;padding:13px;border:1px solid var(--border);border-radius:12px}.link-result p{font-size:12px;margin:0}.link-result .actions a{display:inline-flex;align-items:center;text-decoration:none;font-size:13px;font-weight:740;min-height:40px}
#notice{position:fixed;z-index:100;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 30px);background:#30222a;color:white;padding:13px 18px;border-radius:12px;box-shadow:0 12px 35px #34152030;font-size:13px;font-weight:650}footer{padding:23px;text-align:center;color:var(--muted);font-size:11px;border-top:1px solid var(--border)}footer strong{color:var(--wine)}footer span{padding:0 5px}
@media(max-width:820px){.grid{grid-template-columns:1fr}.dashboard-hero{align-items:flex-start;flex-direction:column}.dashboard-hero .actions{width:100%}.dashboard-hero .actions button{flex:1}}
@media(max-width:600px){.header-inner{min-height:64px;padding:9px 14px;gap:9px}.brand img{width:118px;max-width:33vw}.brand-divider{height:23px}.header-title strong{font-size:12px}.header-title small{font-size:9px}.role-chip{display:none!important}.btn-exit{padding:8px 9px;font-size:11px;min-height:34px}main{padding:17px 14px 35px;min-height:calc(100vh - 140px)}.portal-tabs{margin:0 -14px 15px;padding:4px 14px 12px;gap:6px}.portal-tabs button{padding:9px 12px;min-height:42px;font-size:12px}.bar{align-items:stretch;margin-bottom:17px;gap:11px}.company-select{max-width:none;min-width:0;width:100%}.company-select select{width:100%}.page-heading h1{font-size:27px}.card{padding:16px;border-radius:15px}.auth{margin:4vh auto}.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.metric{padding:12px 9px;border-radius:13px}.metric strong{font-size:25px}.metric p{font-size:10px}.metric .metric-icon{width:27px;height:27px;font-size:15px}.dashboard-hero{padding:20px}.dashboard-hero .actions{flex-direction:column;align-items:stretch}.dashboard-hero .actions button{width:100%}.cards{grid-template-columns:1fr}.system-card{min-height:0}.ticket-item{min-height:68px}.messages{min-height:190px}.admin-create form{display:grid}.admin-create form label,.admin-create form button{width:100%}.ticket-detail form button{width:100%}footer{padding:18px 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button,.btn{transition:none}}

/* Access-member details and narrow device safeguards */
.member-info{display:grid;gap:3px;min-width:0;flex:1;overflow-wrap:anywhere}.member-info strong{font-size:12px;font-weight:750}.member-info small{font-size:11px}.admin-users .row{align-items:center}.admin-users .row .status-chip{flex-shrink:0}@media(max-width:380px){.admin-users .row button.danger{width:100%}.admin-users .row .member-info{flex-basis:100%}.header-title small{display:none}}

.access-audit{display:grid;gap:12px}.audit-list{display:grid;gap:8px}.audit-entry{padding:12px;border:1px solid #e7e1e4;border-radius:12px;display:grid;gap:5px;overflow-wrap:anywhere}.audit-entry p{font-size:12px;margin:0}.audit-entry small{color:#777}.access-audit button{min-height:44px}.admin-users .row{flex-wrap:wrap;gap:8px}@media(max-width:520px){.access-audit button{width:100%}}
