/* Portal do Cliente — extensão do design system Baken */
.portal-page { background: var(--neutral-100); color: var(--neutral-700); }
.portal-wrap { min-height: 100svh; display: flex; flex-direction: column; }
.portal-bar { background: var(--white); border-bottom: 1px solid var(--neutral-200); padding: 1.15rem 0; }
.portal-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); }
.portal-bar__logo img { height: 34px; width: auto; }
.portal-bar__actions { display: flex; align-items: center; gap: 1rem; font-size: var(--text-sm); }
.portal-account-link { color: var(--neutral-500); font-weight: 500; transition: color var(--duration); }
.portal-account-link:hover { color: var(--primary); }
.portal-user { color: var(--neutral-900); font-weight: 600; }
.portal-main { flex: 1; padding: 4.5rem 0 5.5rem; }
.portal-content { max-width: 760px; }
.portal-eyebrow { display: inline-flex; margin-bottom: 1rem; padding: .3rem .85rem; border-radius: var(--radius-full); background: var(--primary-light); color: var(--primary); font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.portal-content > h1 { margin-bottom: .75rem; color: var(--neutral-900); font-family: var(--font-serif); font-size: clamp(2.2rem, 5vw, 3.25rem); font-weight: 400; line-height: 1.12; }
.portal-content > h1 + .card::before { content: "Assistência técnica e manutenção"; display: block; margin: -2rem -2rem 1.75rem; padding: 1.1rem 2rem; border-radius: 10px 10px 0 0; background: var(--neutral-900); color: var(--white); font-size: var(--text-sm); font-weight: 600; letter-spacing: .04em; }
.card { margin: 1.75rem 0; padding: 2rem; border: 1px solid rgba(15,15,15,.07); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-md); }
.card h2 { margin-bottom: .6rem; color: var(--neutral-900); font-family: var(--font-serif); font-size: var(--text-2xl); font-weight: 400; }
.card p { margin-bottom: 1rem; }
.field { margin-bottom: 1.15rem; }
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.field label { display: block; margin-bottom: .5rem; color: var(--neutral-500); font-size: .69rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.field label:has(input[type="checkbox"]) { display: flex; gap: .55rem; align-items: flex-start; text-transform: none; letter-spacing: 0; font-size: var(--text-sm); font-weight: 400; line-height: 1.5; }
.field label a { color: var(--primary); text-decoration: underline; }
.field input:not([type="checkbox"]), .field textarea, .field select { width: 100%; padding: .86rem 1rem; border: 1.5px solid var(--neutral-200); border-radius: 4px; outline: none; background: var(--neutral-100); color: var(--neutral-900); font: inherit; transition: border-color var(--duration), box-shadow var(--duration), background var(--duration); }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(200,16,46,.09); background: var(--white); }
.field textarea { min-height: 135px; resize: vertical; }
.password-field { position: relative; }.password-field input { padding-right: 3rem !important; }.password-toggle { position: absolute; top: 50%; right: .45rem; display: inline-flex; align-items: center; justify-content: center; width: 2.2rem; height: 2.2rem; transform: translateY(-50%); border: 0; border-radius: 4px; color: var(--neutral-500); background: transparent; cursor: pointer; }.password-toggle:hover, .password-toggle[aria-pressed="true"] { color: var(--primary); background: var(--primary-light); }.password-toggle:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }.password-toggle svg { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-width: 1.8; }
.honeypot { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; border: 0 !important; white-space: nowrap !important; }
.privacy-consent { margin-top: 1.5rem; padding: 1rem; border: 1px solid var(--neutral-200); border-radius: var(--radius-md); background: var(--neutral-100); }
.privacy-consent label { display: flex; align-items: flex-start; gap: .7rem; margin: 0; color: var(--neutral-700); font-size: var(--text-sm); font-weight: 400; letter-spacing: 0; line-height: 1.55; text-transform: none; }
.privacy-consent input[type="checkbox"] { width: 1rem; height: 1rem; margin: .22rem 0 0; accent-color: var(--primary); flex: 0 0 auto; }
.privacy-consent a { color: var(--primary); font-weight: 600; text-decoration: underline; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .8rem 1.25rem; border: 0; border-radius: 4px; background: var(--primary); color: var(--white); font: inherit; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; transition: background var(--duration), transform var(--duration), box-shadow var(--duration); }
.btn:hover { background: var(--primary-dark); color: var(--white); transform: translateY(-1px); box-shadow: 0 7px 18px rgba(200,16,46,.23); }
.btn.alt { background: var(--neutral-800); }.btn.alt:hover { background: var(--neutral-900); }
.portal-flash { margin: 0 0 1.25rem; padding: .95rem 1rem; border-radius: var(--radius-md); font-size: var(--text-sm); }.portal-flash--success { background: #edf8f0; color: #166534; }.portal-flash--error { background: #fff0f2; color: #a10d25; }
.muted { color: var(--neutral-500); }.small { font-size: var(--text-xs); }.actions { display: flex; flex-wrap: wrap; gap: .5rem; }.actions .btn { min-height: 36px; padding: .55rem .8rem; font-size: .65rem; }
.table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }.table th { color: var(--neutral-500); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }.table th, .table td { padding: .85rem .5rem; border-bottom: 1px solid var(--neutral-200); text-align: left; vertical-align: top; }.table th:first-child, .table td:first-child { padding-left: 0; }.table th:last-child, .table td:last-child { padding-right: 0; }
.admin-menu { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1.5rem 0 2rem; }.admin-menu button { display: inline-flex; align-items: center; gap: .5rem; padding: .6rem .8rem; border: 1px solid var(--neutral-200); border-radius: var(--radius-full); background: var(--white); color: var(--neutral-700); font: inherit; font-size: var(--text-sm); font-weight: 600; cursor: pointer; }.admin-menu button:hover, .admin-menu button:focus-visible, .admin-menu button[aria-selected="true"] { border-color: var(--primary); background: var(--primary); color: var(--white); outline: none; }.admin-menu span, .admin-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.55rem; height: 1.55rem; padding: 0 .4rem; border-radius: var(--radius-full); background: var(--primary-light); color: var(--primary); font-size: .7rem; font-weight: 700; }.admin-menu button[aria-selected="true"] span { background: rgba(255,255,255,.18); color: var(--white); }.admin-section { scroll-margin-top: 1rem; }.admin-section[hidden] { display: none; }.admin-section__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }.admin-section__header h2 { margin: 0; }.admin-section__eyebrow { margin: 0 0 .3rem; color: var(--neutral-500); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.data-table__toolbar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }.data-table__toolbar label { display: flex; flex-direction: column; gap: .35rem; color: var(--neutral-500); font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.data-table__search { flex: 1; }.data-table input[type="search"], .data-table select { min-height: 38px; border: 1px solid var(--neutral-200); border-radius: 4px; background: var(--neutral-100); color: var(--neutral-900); font: inherit; }.data-table input[type="search"] { width: 100%; padding: .65rem .75rem; }.data-table select { padding: .45rem .55rem; }.data-table__scroll { overflow-x: auto; }.data-table .table th button { display: inline-flex; align-items: center; gap: .3rem; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }.data-table .table th button::after { content: '↕'; color: var(--neutral-400); font-size: .9rem; }.data-table .table th button[aria-sort="ascending"]::after { content: '↑'; color: var(--primary); }.data-table .table th button[aria-sort="descending"]::after { content: '↓'; color: var(--primary); }.data-table__footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; color: var(--neutral-500); font-size: var(--text-xs); }.data-table__footer [data-dt-pagination] { display: flex; align-items: center; gap: .35rem; }.data-table__footer button { min-width: 2rem; height: 2rem; border: 1px solid var(--neutral-200); border-radius: 4px; background: var(--white); color: var(--neutral-700); cursor: pointer; }.data-table__footer button:hover:not(:disabled), .data-table__footer button[aria-current="page"] { border-color: var(--primary); background: var(--primary); color: var(--white); }.data-table__footer button:disabled { opacity: .45; cursor: not-allowed; }
.admin-actions { display: flex; flex-wrap: nowrap; gap: .4rem; }.admin-icon-button { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; padding: 0; border: 1px solid var(--neutral-200); border-radius: 4px; background: var(--white); color: var(--neutral-700); cursor: pointer; transition: background var(--duration), border-color var(--duration), color var(--duration); }.admin-icon-button:hover, .admin-icon-button:focus-visible { border-color: var(--primary); background: var(--primary-light); color: var(--primary); outline: none; }.admin-icon-button--reject:hover, .admin-icon-button--delete:hover, .admin-icon-button--reject:focus-visible, .admin-icon-button--delete:focus-visible { border-color: #b42318; background: #fff1f0; color: #b42318; }.admin-icon-button--revoke:hover, .admin-icon-button--revoke:focus-visible { border-color: #9a6700; background: #fff7e6; color: #9a6700; }.admin-icon-button svg { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }.admin-icon-button[data-tooltip]::after { position: absolute; z-index: 10; bottom: calc(100% + .45rem); left: 50%; width: max-content; max-width: 190px; padding: .45rem .6rem; border-radius: 4px; background: var(--neutral-900); color: var(--white); content: attr(data-tooltip); font-size: .7rem; font-weight: 600; letter-spacing: 0; line-height: 1.25; opacity: 0; pointer-events: none; transform: translate(-50%, .2rem); transition: opacity var(--duration), transform var(--duration); }.admin-icon-button[data-tooltip]:hover::after, .admin-icon-button[data-tooltip]:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }.status-pill { display: inline-flex; padding: .28rem .55rem; border-radius: var(--radius-full); background: var(--neutral-100); color: var(--neutral-600); font-size: .7rem; font-weight: 700; }.status-pill--approved { background: #edf8f0; color: #166534; }.status-pill--rejected { background: #fff0f2; color: #a10d25; }.status-pill--disabled { background: #fff7e6; color: #9a6700; }
.portal-footer { padding: 1.5rem 0; border-top: 1px solid var(--neutral-200); color: var(--neutral-400); font-size: var(--text-xs); }
.login-links { margin: 1.15rem 0 0; }
.ticket-portal-badge { display:inline-flex; margin-bottom:1.15rem; padding:.3rem .85rem; border-radius:var(--radius-full); background:var(--primary-light); color:var(--primary); font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.client-unsubscribe { max-width:680px; margin:1.5rem auto 0; text-align:center; }.client-unsubscribe button { border:0; background:transparent; color:var(--neutral-500); font:inherit; font-size:.78rem; text-decoration:underline; cursor:pointer; }.client-unsubscribe button:hover { color:var(--primary); }
.ticket-portal-header { max-width: 680px; margin: 0 auto 1.75rem; text-align: center; }.ticket-portal-header .portal-eyebrow { margin-bottom: 1.15rem; }.ticket-portal-header h1 { margin: 0 0 .75rem; color: var(--neutral-900); font-family: var(--font-serif); font-size: clamp(2rem,4vw,2.75rem); font-weight: 400; line-height: 1.2; }.ticket-portal-header p { max-width: 480px; margin: 0 auto; color: var(--neutral-500); font-size: 1.0625rem; font-weight: 300; line-height: 1.7; }.ticket-tabs { display: flex; justify-content: center; gap: .65rem; max-width: 680px; margin: 0 auto 1.25rem; }.ticket-tabs button { display: inline-flex; align-items: center; gap: .45rem; padding: .65rem 1rem; border: 1px solid var(--neutral-200); border-radius: var(--radius-full); background: var(--white); color: var(--neutral-700); font: inherit; font-size: var(--text-sm); font-weight: 600; cursor: pointer; }.ticket-tabs button[aria-selected="true"], .ticket-tabs button:hover { border-color: var(--primary); background: var(--primary); color: var(--white); }.ticket-tabs span { display:inline-flex; align-items:center; justify-content:center; min-width:1.4rem; height:1.4rem; padding:0 .35rem; border-radius:50%; background:var(--primary-light); color:var(--primary); font-size:.7rem; }.ticket-tabs button[aria-selected="true"] span { background:rgba(255,255,255,.18); color:var(--white); }.ticket-panel[hidden] { display:none; }.ticket-portal-card { max-width: 680px; margin: 0 auto; overflow: hidden; border-radius: 10px; background: var(--white); box-shadow: var(--shadow-md); }.ticket-portal-card__head { display:flex; align-items:center; gap:1rem; padding:1.5rem 2rem; background:var(--neutral-900); }.ticket-portal-card__icon { display:grid; width:40px; height:40px; flex:0 0 40px; place-items:center; border-radius:6px; background:rgba(200,16,46,.15); color:var(--primary); font-weight:700; }.ticket-portal-card__icon svg { width:20px; height:20px; }.ticket-portal-card__head strong, .ticket-portal-card__head span { display:block; }.ticket-portal-card__head strong { color:var(--white); font-size:1rem; }.ticket-portal-card__head span { margin-top:2px; color:rgba(255,255,255,.45); font-size:.8125rem; font-weight:300; }.ticket-portal-card__body { padding:2rem; }.ticket-portal-card__body .field label b, .ticket-priority legend b { color:var(--primary); }.ticket-priority { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin:0 0 1.25rem; padding:0; border:0; }.ticket-priority legend { grid-column:1/-1; margin-bottom:.5rem; color:var(--neutral-500); font-size:.69rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.ticket-priority input { position:absolute; opacity:0; pointer-events:none; }.ticket-priority label { display:flex; flex-direction:column; align-items:center; gap:4px; padding:.875rem; border:1.5px solid var(--neutral-200); border-radius:4px; background:var(--neutral-100); color:var(--neutral-500); font-size:.8125rem; font-weight:500; cursor:pointer; text-align:center; }.ticket-priority label span { font-size:1.125rem; }.ticket-priority input:checked + label { border-color:var(--primary); background:var(--primary-light); color:var(--primary); }.ticket-divider { height:1px; margin:1.5rem 0; background:var(--neutral-200); }.ticket-submit { display:flex; width:100%; align-items:center; justify-content:center; gap:.5rem; padding:1rem 2rem; border:0; border-radius:4px; background:var(--primary); color:var(--white); font:inherit; font-size:.875rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; }.ticket-submit:hover { background:var(--primary-dark); }.ticket-privacy { margin:1rem 0 0; color:var(--neutral-400); font-size:.75rem; font-weight:300; text-align:center; }.ticket-note { display:flex; gap:.75rem; max-width:680px; margin:1.5rem auto 0; padding:1rem 1.25rem; border:1px solid rgba(200,16,46,.12); border-radius:6px; background:rgba(200,16,46,.04); color:var(--neutral-500); font-size:.875rem; font-weight:300; line-height:1.6; }.ticket-note strong { color:var(--neutral-900); }.ticket-note a { color:var(--primary); font-weight:600; }
.portal-modal[hidden] { display: none; }.portal-modal { position: fixed; z-index: 400; inset: 0; display: grid; place-items: center; padding: 1.25rem; }.portal-modal__backdrop { position: absolute; inset: 0; background: rgba(16,16,16,.56); backdrop-filter: blur(3px); }.portal-modal__dialog { position: relative; width: min(100%,30rem); padding: 2rem; border-radius: 1rem; background: var(--white); box-shadow: 0 1.5rem 4rem rgba(0,0,0,.24); }.portal-modal__close { position: absolute; top: .75rem; right: .9rem; border: 0; background: transparent; color: var(--neutral-600); font-size: 1.75rem; line-height: 1; cursor: pointer; }.portal-modal__eyebrow { margin: 0 0 .65rem; color: var(--primary); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.portal-modal__dialog h2 { margin: 0 0 .8rem; }.portal-modal__dialog p:not(.portal-modal__eyebrow) { margin: 0; color: var(--neutral-600); line-height: 1.55; }.portal-modal__actions { display: flex; justify-content: flex-end; gap: .75rem; margin-top: 1.5rem; }.btn--ghost { border: 1px solid var(--neutral-200) !important; background: var(--white) !important; color: var(--neutral-800) !important; }.btn--ghost:hover { border-color: var(--primary) !important; color: var(--primary) !important; }
.admin-page-title { margin-bottom:.5rem!important; font-size:clamp(2rem,4vw,2.65rem)!important; }.admin-ticket-row { cursor:pointer; }.admin-ticket-row:hover td, .admin-ticket-row:focus-visible td { background:var(--primary-light); }.admin-ticket-row:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }.ticket-detail-modal[hidden] { display:none; }.ticket-detail-modal { position:fixed; z-index:400; inset:0; display:grid; place-items:center; padding:1.25rem; }.ticket-detail-modal__backdrop { position:absolute; inset:0; background:rgba(16,16,16,.56); backdrop-filter:blur(3px); }.ticket-detail-modal__dialog { position:relative; width:min(100%,38rem); max-height:calc(100vh - 2.5rem); overflow:auto; padding:2rem; border-radius:1rem; background:var(--white); box-shadow:0 1.5rem 4rem rgba(0,0,0,.24); }.ticket-detail-modal__close { position:absolute; top:.75rem; right:.9rem; border:0; background:transparent; color:var(--neutral-600); font-size:1.75rem; cursor:pointer; }.ticket-detail-modal__dialog h2 { margin:0 0 1.25rem; font-family:var(--font-serif); font-size:2rem; font-weight:400; }.ticket-detail-modal dl { display:grid; grid-template-columns:10rem 1fr; gap:.65rem 1rem; margin:0; }.ticket-detail-modal dt { color:var(--neutral-500); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.ticket-detail-modal dd { margin:0; line-height:1.5; white-space:pre-wrap; }
@media (max-width: 600px) { .portal-bar__actions { gap: .7rem; }.portal-account-link:last-child { display: none; }.portal-main { padding: 2.75rem 0 3.5rem; }.card { padding: 1.35rem; }.portal-content > h1 + .card::before { margin: -1.35rem -1.35rem 1.25rem; padding: 1rem 1.35rem; }.form-row { grid-template-columns: 1fr; gap: 0; }.table { display: block; overflow-x: auto; white-space: nowrap; }.data-table__toolbar, .data-table__footer { align-items: stretch; flex-direction: column; }.data-table__page-size { align-self: flex-start; }.admin-section__header { align-items: flex-start; flex-direction: column; }.admin-icon-button[data-tooltip]::after { left: auto; right: 0; transform: translate(0, .2rem); }.admin-icon-button[data-tooltip]:hover::after, .admin-icon-button[data-tooltip]:focus-visible::after { transform: translate(0, 0); } }