/* Order Tracking for WooCommerce — frontend styles */

.ahth-track{
    --ahth-black:#111827;
    --ahth-line:#E5E7EB;
    --ahth-muted:#6B7280;

    width:100%;
    max-width:860px;
    margin:0 auto;
    padding:40px 0;
    font-family:inherit;
    color:var(--ahth-black);
    box-sizing:border-box;
}

.ahth-track *{ margin:0; box-sizing:border-box; }

/* Header */

.ahth-track .ahth-head{ max-width:760px; margin:0 auto 34px; text-align:center; }

.ahth-track .ahth-kicker{
    display:inline-block;
    font-size:13px; font-weight:700;
    letter-spacing:3px; text-transform:uppercase;
    color:var(--ahth-muted); margin-bottom:14px;
}

.ahth-track .ahth-title{
    font-size:40px; font-weight:800; line-height:1.2;
    color:var(--ahth-black); letter-spacing:-.5px;
}

.ahth-track .ahth-sub{
    margin-top:16px; font-size:18px; line-height:1.7; color:var(--ahth-muted);
}

/* Search card */

.ahth-searchcard{
    background:#fff;
    border:1px solid var(--ahth-line);
    border-radius:18px;
    padding:22px;
    box-shadow:0 16px 40px rgba(15,23,42,.06);
}

.ahth-form{ display:flex; flex-direction:column; gap:16px; }
.ahth-fields{ display:flex; gap:12px; }
.ahth-field{ flex:1; min-width:0; }
.ahth-field-sm{ flex:0 0 210px; }

.ahth-flabel{
    display:block;
    font-size:11.5px; font-weight:700;
    letter-spacing:2px; text-transform:uppercase;
    color:var(--ahth-muted); margin-bottom:7px;
}

.ahth-inputwrap{ position:relative; }

.ahth-inputic{
    position:absolute; left:16px; top:50%;
    transform:translateY(-50%);
    width:20px; height:20px;
    color:#9CA3AF; pointer-events:none;
}

.ahth-inputwrap input{
    width:100%; height:54px;
    border:1px solid var(--ahth-line);
    border-radius:14px;
    background:#F9FAFB;
    padding:0 16px 0 46px;
    font-size:16px; font-family:inherit;
    color:var(--ahth-black);
    outline:none; transition:.25s ease;
}

.ahth-inputwrap input:focus{
    border-color:var(--ahth-black);
    background:#fff;
    box-shadow:0 0 0 3px rgba(17,24,39,.08);
}

.ahth-inputwrap input::placeholder{ color:#9CA3AF; }

.ahth-btn{
    height:54px; padding:0 30px;
    border:none; border-radius:14px;
    background:var(--ahth-black); color:#fff;
    font-size:16px; font-weight:700; font-family:inherit;
    cursor:pointer; transition:.25s ease; white-space:nowrap;
}

.ahth-btn:hover{ filter:brightness(.9); transform:translateY(-1px); box-shadow:0 10px 24px rgba(15,23,42,.18); }
.ahth-btn:disabled{ opacity:.6; cursor:not-allowed; transform:none; box-shadow:none; }

.ahth-error{
    display:none; margin-top:14px; padding:14px 16px;
    border:1px solid var(--ahth-black); border-radius:12px;
    background:#F9FAFB; color:var(--ahth-black);
    font-size:15px; line-height:1.6;
}

.ahth-error.ahth-show{ display:block; }

/* Result card */

.ahth-result{ margin-top:20px; }

.ahth-card{
    background:#fff;
    border:1px solid var(--ahth-line);
    border-radius:18px; overflow:hidden;
    box-shadow:0 16px 40px rgba(15,23,42,.08);
    animation:ahthFade .35s ease;
}

@keyframes ahthFade{
    from{ opacity:0; transform:translateY(8px); }
    to{ opacity:1; transform:translateY(0); }
}

.ahth-cardtop{
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; flex-wrap:wrap;
    padding:20px 24px;
    background:var(--ahth-black);
}

.ahth-oid{ color:#fff; font-size:18px; font-weight:700; }
.ahth-odate{ display:block; margin-top:3px; color:#9CA3AF; font-size:13px; font-weight:500; }

.ahth-badge{
    padding:8px 16px; border-radius:999px;
    background:#fff; color:var(--ahth-black);
    font-size:13.5px; font-weight:700; letter-spacing:.3px; white-space:nowrap;
}

.ahth-badge.ahth-bad{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5); }

/* Progress */

.ahth-steps{ display:flex; padding:26px 24px 8px; }
.ahth-step{ flex:1; text-align:center; position:relative; }

.ahth-step::before{
    content:""; position:absolute;
    top:15px; left:-50%; width:100%; height:2px;
    background:var(--ahth-line);
}

.ahth-step:first-child::before{ display:none; }
.ahth-step.ahth-done::before{ background:var(--ahth-black); }

.ahth-dot{
    width:32px; height:32px; margin:0 auto;
    border-radius:50%; background:#fff;
    border:2px solid var(--ahth-line);
    position:relative; z-index:1;
    display:flex; align-items:center; justify-content:center;
    color:transparent; transition:.25s;
}

.ahth-dot svg{ width:14px; height:14px; }

.ahth-step.ahth-done .ahth-dot{ background:var(--ahth-black); border-color:var(--ahth-black); color:#fff; }

.ahth-steplabel{
    display:block; margin-top:8px;
    font-size:12.5px; font-weight:600;
    color:#9CA3AF; line-height:1.4;
}

.ahth-step.ahth-done .ahth-steplabel{ color:var(--ahth-black); }

/* Shipping strip */

.ahth-shipstrip{
    margin:20px 24px 0; padding:14px 16px;
    background:#F3F4F6; border-radius:14px;
    font-size:15px; font-weight:600;
    color:var(--ahth-black); line-height:1.6;
}

.ahth-shipstrip span{
    display:inline-block;
    font-size:11.5px; font-weight:700;
    letter-spacing:2px; text-transform:uppercase;
    color:var(--ahth-muted); margin-bottom:4px;
}

/* Details */

.ahth-details{ display:grid; grid-template-columns:repeat(2,1fr); padding:10px 24px 4px; }
.ahth-row{ padding:14px 0; border-bottom:1px solid #F3F4F6; }
.ahth-row.ahth-full{ grid-column:1 / -1; }

.ahth-label{
    display:block;
    font-size:11.5px; font-weight:700;
    letter-spacing:2px; text-transform:uppercase;
    color:var(--ahth-muted); margin-bottom:5px;
}

.ahth-value{
    font-size:15.5px; font-weight:600;
    color:var(--ahth-black); line-height:1.6; word-break:break-word;
}

.ahth-value small{
    display:block; margin-top:2px;
    font-size:13px; font-weight:500; color:var(--ahth-muted);
}

/* Products */

.ahth-items{ padding:6px 24px 22px; }
.ahth-items .ahth-label{ padding-top:14px; }

.ahth-item{
    display:flex; justify-content:space-between; gap:12px;
    padding:10px 0; border-bottom:1px dashed var(--ahth-line);
    font-size:15px; color:#4B5563;
}

.ahth-item:last-of-type{ border-bottom:none; }
.ahth-item b{ color:var(--ahth-black); white-space:nowrap; }

.ahth-total{
    display:flex; justify-content:space-between;
    margin-top:6px; padding-top:14px;
    border-top:2px solid var(--ahth-black);
    font-size:16.5px; font-weight:800; color:var(--ahth-black);
}

/* Privacy */

.ahth-privacy{
    display:flex; align-items:center; gap:8px;
    margin:4px 24px 0; padding:10px 0 0;
    font-size:12.5px; color:#9CA3AF; line-height:1.6;
}

.ahth-privacy svg{ width:14px; height:14px; flex:none; }

/* Help */

.ahth-help{ margin-top:26px; text-align:center; font-size:15.5px; color:var(--ahth-muted); }

.ahth-help a{
    color:var(--ahth-black); font-weight:700;
    text-decoration:none;
    border-bottom:2px solid var(--ahth-black);
    padding-bottom:1px; transition:.2s;
}

.ahth-help a:hover{ opacity:.7; }

/* Spinner */

.ahth-spin{
    display:inline-block; width:16px; height:16px;
    border:2px solid rgba(255,255,255,.35);
    border-top-color:#fff; border-radius:50%;
    vertical-align:-3px; margin-right:8px;
    animation:ahthSpin .7s linear infinite;
}

@keyframes ahthSpin{ to{ transform:rotate(360deg); } }

/* Responsive */

@media(max-width:767px){
    .ahth-track .ahth-head{ margin-bottom:26px; }
    .ahth-track .ahth-title{ font-size:32px; }
    .ahth-track .ahth-sub{ font-size:16px; }
    .ahth-searchcard{ padding:16px; }
    .ahth-fields{ flex-direction:column; }
    .ahth-field-sm{ flex:1 1 auto; }
    .ahth-btn{ width:100%; }
    .ahth-cardtop{ padding:16px 18px; }
    .ahth-steps{ padding:22px 12px 6px; }
    .ahth-steplabel{ font-size:11px; }
    .ahth-shipstrip{ margin:16px 18px 0; }
    .ahth-details{ grid-template-columns:1fr; padding:8px 18px 2px; }
    .ahth-items{ padding:4px 18px 18px; }
}
