[hidden]{display:none!important}

/* ============ LAYOUT GERAL ============ */
.tracking-page,.customer-page{max-width:1180px;margin:0 auto;padding:60px 30px 90px}

/* ============ TRACKING INTRO (legado) ============ */
.tracking-intro{background:linear-gradient(135deg,#fff5f3,#fdeae6);border-radius:24px;padding:48px 54px;display:grid;gap:28px;grid-template-columns:1fr}
.back-link{font-size:11px;color:#8a7f7c;letter-spacing:.3px;font-weight:600}
.back-link:hover{color:var(--red)}
.tracking-intro h1,.auth-pitch h1{font-size:46px;line-height:1.1;letter-spacing:-1.8px;color:var(--ink);margin:16px 0 14px;font-weight:750}
.tracking-intro p{font-size:14px;color:#5c6168;margin:0;line-height:1.7;max-width:560px}
.tracking-intro form{max-width:620px;margin-top:10px}
.tracking-intro label{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#5c6168;display:block;margin-bottom:10px}
.search-row{display:flex;gap:12px;background:#fff;border:1px solid #ececec;border-radius:16px;padding:8px;box-shadow:0 10px 30px rgba(0,0,0,.04)}
.search-row input{flex:1;background:transparent;border:0;padding:14px 16px;font-size:15px;outline:0;color:var(--ink)}
.search-row button{min-width:140px;background:var(--red);color:#fff;border:0;border-radius:12px;padding:14px 24px;font-size:13px;font-weight:700;cursor:pointer;transition:background .18s;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.search-row button:hover{background:#bd0000}

/* ============ FEEDBACK / STATUS ============ */
.feedback{font-size:13px;line-height:1.7;color:#5c6168;padding:16px 0;white-space:pre-line}
.feedback:empty{display:none}
.feedback.error{color:#8a1515;background:#fff5f3;border:1px solid #fdd;padding:16px 20px;border-radius:12px;margin-top:18px;display:flex;align-items:flex-start;gap:12px}
.feedback.success{color:#1f5f33;background:#eafbea;border:1px solid #c2e9c7;padding:16px 20px;border-radius:12px;margin-top:18px}

/* ============ TRACKING RESULT (legado) ============ */
.tracking-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:38px 0 24px;flex-wrap:wrap}
.tracking-summary h2{font-size:28px;letter-spacing:-.9px;margin:10px 0 8px;line-height:1.2}
.tracking-number{font-family:'SFMono-Regular',Consolas,Menlo,monospace;font-size:13px;background:#fff;color:#8a4040;padding:5px 12px;border-radius:50px;display:inline-block;margin:4px 0 0}
.secondary-btn{background:#fff;border:1px solid #e0e0e0;border-radius:50px;padding:12px 22px;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:8px}
.secondary-btn:hover{border-color:var(--red);color:var(--red)}
.tracking-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:30px}
.tracking-metrics>div{background:#fafafa;border:0;border-radius:14px;padding:18px 20px}
.tracking-metrics small{display:block;font-size:10px;color:#8a8a8a;letter-spacing:.8px;text-transform:uppercase;margin-bottom:7px;font-weight:600}
.tracking-metrics strong{display:block;font-size:14px;color:var(--ink);font-weight:700;line-height:1.3}
.tracking-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;margin-top:28px}
.timeline-card,.tracking-aside,.portal-card{background:#fff;border:1px solid #ececec;border-radius:22px;padding:30px 32px}
.timeline-card h3,.tracking-aside h3{font-size:18px;letter-spacing:-.3px;margin:0 0 22px;color:var(--ink)}
.timeline{list-style:none;margin:0;padding:0;position:relative}
.timeline li{position:relative;padding:0 0 24px 46px}
.timeline li:not(:last-child):before{content:'';position:absolute;left:14px;top:28px;bottom:0;width:2px;background:#f0e2e2}
.timeline-dot{position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#f1f1f1;color:#bababa;font-size:13px;font-weight:700}
.complete .timeline-dot{background:var(--red);color:#fff}
.failure.complete .timeline-dot{background:#ba7200}
.timeline-title strong{display:block;font-size:14px;font-weight:700;color:var(--ink);line-height:1.4}
.timeline-title time{display:block;font-size:11px;color:#8a8a8a;margin-top:3px;letter-spacing:.2px}
.timeline li p{font-size:12.5px;color:#5c6168;line-height:1.65;margin:6px 0 0}
.pending{opacity:.55}
.route-caption{display:inline-flex;align-items:center;gap:5px;background:#fff5f3;color:var(--red);font-size:11px;font-weight:600;padding:4px 10px;border-radius:50px;margin-top:8px}
.tracking-aside{background:#fafafa}
.tracking-aside p{font-size:12.5px;color:#5c6168;line-height:1.65}
.tracking-aside a{color:var(--red);font-size:12px;font-weight:600}
.tracking-aside .secondary-btn{display:block;width:fit-content;margin-top:22px}
.programmed-note{background:#fff5f3;border-left:3px solid var(--red);border-radius:0 10px 10px 0;padding:16px 20px;margin:18px 0}
.programmed-note strong{font-size:11px;color:#8a4040;letter-spacing:.3px;text-transform:uppercase}
.programmed-note p{font-size:12px;color:#5c6168;margin:6px 0 0;line-height:1.6}
.tracking-help{margin-top:50px;text-align:center;background:#fafafa;border-radius:18px;padding:28px}
.tracking-help strong{display:block;font-size:14px;color:var(--ink);margin-bottom:6px}
.tracking-help p{font-size:12.5px;color:#5c6168;margin:0 0 10px;line-height:1.65}
.tracking-help a{color:var(--red);font-size:12.5px;font-weight:700}

/* ============ FOOTER DO PORTAL ============ */
.portal-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;padding:28px max(28px,calc((100vw - 1120px)/2));color:#8a8a8a;border-top:1px solid #ececec;background:#fafafa}
.portal-footer a{color:#5c6168;transition:color .15s;font-weight:600}
.portal-footer a:hover{color:var(--red)}

/* ============ AUTH (LOGIN / SIGNUP) ============ */
.auth-layout{display:grid;grid-template-columns:.95fr 1fr;gap:70px;align-items:center;min-height:580px}
.auth-pitch>span{display:inline-block;font-size:11px;color:var(--red);letter-spacing:1.4px;font-weight:700;text-transform:uppercase;margin-bottom:12px}
.auth-pitch h1{font-size:52px;line-height:1.08;letter-spacing:-2px;margin:0 0 20px;color:var(--ink);font-weight:750}
.auth-pitch p{font-size:14px;color:#5c6168;max-width:420px;line-height:1.75;margin:0 0 28px}
.auth-pitch>a{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--red);font-weight:700;transition:gap .18s}
.auth-pitch>a:hover{gap:10px}
.auth-card{background:#fff;border:1px solid #ececec;border-radius:24px;padding:42px 40px;box-shadow:0 20px 50px rgba(0,0,0,.04)}
.auth-tabs{display:flex;gap:4px;background:#f6f6f6;border-radius:50px;padding:5px;margin-bottom:28px}
.auth-tabs button{flex:1;background:transparent;border:0;padding:11px 18px;color:#8a8a8a;font-size:12.5px;font-weight:700;border-radius:50px;cursor:pointer;transition:background .18s,color .18s}
.auth-tabs .selected{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.06)}
.auth-card h2{font-size:22px;line-height:1.3;letter-spacing:-.5px;margin:0 0 22px;color:var(--ink);font-weight:700}
.auth-card label,.portal-card label{display:block;font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#5c6168;margin:16px 0 8px}
.auth-card input,.portal-card input,.portal-card select,.portal-card textarea{display:block;width:100%;background:#fafafa;border:1px solid #ececec;border-radius:12px;padding:14px 16px;font-size:14px;color:var(--ink);outline:0;transition:border-color .15s,background .15s;font-family:inherit}
.auth-card input:focus,.portal-card input:focus,.portal-card select:focus,.portal-card textarea:focus{border-color:var(--red);background:#fff}
.auth-card .btn,.portal-card .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--red);color:#fff;border:0;border-radius:50px;padding:16px 28px;font-size:13px;font-weight:700;cursor:pointer;transition:background .18s;margin-top:22px}
.auth-card .btn:hover,.portal-card .btn:hover{background:#bd0000}
.auth-card .btn:disabled,.portal-card .btn:disabled{background:#f5caca;cursor:wait;position:relative}
.link-button{display:inline-flex;align-items:center;gap:5px;background:none;border:0;color:var(--red);font-size:12px;font-weight:600;margin-top:18px;padding:6px 0;cursor:pointer}
.link-button:hover{text-decoration:underline}
#auth-feedback{min-height:0;margin:14px 0 0}
#auth-feedback:not(:empty){margin-top:16px;font-size:12.5px;line-height:1.6;padding:12px 16px;border-radius:10px;background:#fff5f3;color:#8a1515}

/* ============ DASHBOARD ============ */
.dashboard-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;margin-bottom:12px}
.dashboard-head>div{min-width:0;flex:1}
.dashboard-head .eyebrow{color:var(--red);font-size:11px;letter-spacing:1.4px;font-weight:700;margin-bottom:10px;display:inline-flex;align-items:center;gap:10px}
.dashboard-head .eyebrow:before{content:'';width:22px;height:2px;background:currentColor}
.dashboard-head h1{font-size:36px;line-height:1.15;letter-spacing:-1.4px;margin:4px 0 8px;color:var(--ink);font-weight:750}
.dashboard-head h1 span{color:var(--red)}
.dashboard-head p{font-size:14px;color:#5c6168;margin:0;line-height:1.6}
.dashboard-head #logout{flex-shrink:0}

.dashboard-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:32px 0 24px;padding:5px;background:#f6f6f6;border-radius:50px;width:fit-content;max-width:100%;overflow-x:auto}
.dashboard-tabs button{background:transparent;border:0;padding:11px 20px;color:#5c6168;font-size:12.5px;font-weight:600;border-radius:50px;cursor:pointer;transition:background .18s,color .18s;white-space:nowrap}
.dashboard-tabs button:hover{color:var(--ink)}
.dashboard-tabs button[aria-selected=true]{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.06)}

#portal-feedback:not(:empty){margin-bottom:18px}

/* ============ CONTEÚDO DO DASHBOARD ============ */
#dashboard-content{animation:fadeContent .3s ease}
@keyframes fadeContent{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

.portal-card{max-width:820px}
.portal-card h2,.portal-empty h2{font-size:22px;letter-spacing:-.5px;margin:0 0 10px;color:var(--ink);font-weight:700}
.portal-card p,.portal-empty p{font-size:13px;color:#5c6168;line-height:1.7;margin:0 0 22px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.portal-empty{background:#fafafa;border-radius:22px;padding:70px 40px;text-align:center;border:1px dashed #e8e8e8}
.portal-empty h2{margin-bottom:8px}
.portal-empty .btn{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;border:0;border-radius:50px;padding:14px 26px;font-size:13px;font-weight:700;cursor:pointer;margin-top:14px;transition:background .18s}
.portal-empty .btn:hover{background:#bd0000}

/* ============ LISTA DE ENCOMENDAS ============ */
.portal-list{display:grid;gap:12px}
.portal-row{display:flex;justify-content:space-between;align-items:center;gap:28px;background:#fff;border:1px solid #ececec;border-radius:20px;padding:22px 28px;transition:border-color .18s,transform .18s,box-shadow .18s}
.portal-row:hover{border-color:#f5caca;transform:translateY(-2px);box-shadow:0 12px 30px rgba(230,0,0,.05)}
.portal-row>div:first-child{min-width:0;flex:1}
.portal-row strong{display:block;font-size:14px;font-family:'SFMono-Regular',Consolas,Menlo,monospace;color:var(--ink);letter-spacing:.3px;margin-bottom:4px}
.portal-row p{font-size:13px;color:var(--ink);margin:4px 0;line-height:1.5}
.portal-row small{display:block;font-size:11px;color:#8a8a8a;letter-spacing:.2px}

.status-pill{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:600;background:#fff5f3;color:#8a4040;border:1px solid #f5caca;border-radius:50px;padding:7px 12px;line-height:1}
.status-pill:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}

.shipment-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex-shrink:0}
.shipment-track-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:42px;padding:11px 20px;background:var(--red);color:#fff;border:0;border-radius:50px;font-size:12px;font-weight:700;text-decoration:none;transition:background .18s,transform .18s;white-space:nowrap}
.shipment-track-button span{font-size:15px;line-height:1}
.shipment-track-button:hover{background:#bd0000;transform:translateY(-1px)}
.shipment-actions .remove-saved{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #ececec;color:#8a8a8a;border-radius:50px;padding:8px 14px;font-size:11px;font-weight:600;cursor:pointer;transition:all .15s;margin:0}
.shipment-actions .remove-saved:hover{border-color:#8a8a8a;color:var(--ink)}
.portal-row .text-link{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:var(--red);margin-top:8px}

/* ============ SAVED TRACKING (legado) ============ */
.saved-tracking-card{background:linear-gradient(135deg,#fff5f3,#fdeae6);border:0;margin-bottom:24px;max-width:none}
.saved-tracking-card h2{font-size:21px}
.saved-tracking-card .btn{margin-top:14px}
.remove-saved{display:inline-block;margin-left:auto;font-size:11px;color:#8a8a8a;background:none;border:0;cursor:pointer;padding:6px 10px}

/* ============ LOADING / SKELETONS ============ */
.portal-loader{display:flex;flex-direction:column;align-items:center;gap:20px;padding:70px 30px;text-align:center}
.portal-spinner{width:48px;height:48px;border:3px solid #f5caca;border-top-color:var(--red);border-radius:50%;animation:portal-spin 1s linear infinite}
@keyframes portal-spin{to{transform:rotate(360deg)}}
.portal-loader p{font-size:13px;color:#8a8a8a;margin:0}
.portal-skeleton{display:grid;gap:12px}
.portal-skeleton .sk{height:84px;background:linear-gradient(90deg,#f5f5f5 25%,#efefef 50%,#f5f5f5 75%);background-size:200% 100%;animation:sk 1.4s infinite;border-radius:20px}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ============ REFRESH / HEADER TOOLBAR ============ */
.portal-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.portal-toolbar .search{flex:1;max-width:360px;position:relative}
.portal-toolbar .search input{width:100%;background:#fafafa;border:1px solid #ececec;border-radius:50px;padding:11px 16px 11px 42px;font-size:13px;outline:0;transition:border-color .15s;font-family:inherit}
.portal-toolbar .search input:focus{border-color:var(--red);background:#fff}
.portal-toolbar .search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#8a8a8a;pointer-events:none}
.portal-refresh{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid #ececec;border-radius:50px;padding:10px 18px;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;transition:all .15s}
.portal-refresh:hover{border-color:var(--red);color:var(--red)}
.portal-refresh svg{transition:transform .4s}
.portal-refresh.spinning svg{animation:portal-spin 1s linear infinite}

.customer-nav{color:var(--red);font-weight:700}

/* ============ MOBILE ============ */
@media(max-width:900px){
.tracking-page,.customer-page{padding:32px 18px 60px}
.tracking-intro{padding:32px 26px;border-radius:20px}
.tracking-intro h1,.auth-pitch h1{font-size:34px;letter-spacing:-1.2px}
.tracking-metrics{grid-template-columns:1fr;gap:10px}
.tracking-layout{grid-template-columns:1fr;gap:16px}
.timeline-card,.tracking-aside{padding:24px}
.tracking-summary{align-items:flex-start}
.auth-layout{grid-template-columns:1fr;gap:36px;min-height:0}
.auth-pitch h1{font-size:36px;letter-spacing:-1.2px}
.auth-card{padding:30px 24px;border-radius:20px}
.dashboard-head{align-items:flex-start}
.dashboard-head h1{font-size:28px;letter-spacing:-1px}
.dashboard-head #logout{align-self:flex-start}
.dashboard-tabs{width:auto;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;border-radius:14px}
.dashboard-tabs::-webkit-scrollbar{display:none}
.form-grid{grid-template-columns:1fr}
.portal-card{padding:26px 22px;border-radius:20px}
.portal-empty{padding:50px 24px}
.portal-row{flex-direction:column;align-items:stretch;gap:16px;padding:22px}
.shipment-actions{flex-direction:row;align-items:center;justify-content:space-between;gap:10px;width:100%}
.shipment-track-button{flex:1;padding:12px 20px}
.portal-toolbar{flex-direction:column;align-items:stretch}
.portal-toolbar .search{max-width:none}
.portal-footer{flex-direction:column;align-items:flex-start;gap:8px;padding:22px 24px}
}
@media(max-width:480px){
.tracking-intro h1,.auth-pitch h1{font-size:28px;letter-spacing:-.9px}
.dashboard-head h1{font-size:24px}
.auth-card h2{font-size:19px}
.portal-row strong{font-size:13px}
}