/* Stiluri comune tuturor paginilor din Pages/Account/ (Dashboard, Punctele Evia, Cum câștig puncte Evia, ...) —
   pattern-uri de markup reutilizate identic pe mai multe pagini ale secțiunii, NU legate de un ViewComponent anume. */

.account-page-title {
    font-size: var(--heading-l-size);
    line-height: var(--heading-l-line);
    color: var(--color-content-primary);
}

.account-section-title {
    font-size: var(--heading-xs-size);
    line-height: var(--heading-xs-line);
    color: var(--color-content-primary);
}

/* Link de previzualizare cu/fără istoric — doar pentru faza de front-end fără date reale, nu apare în machetă.
   Folosit pe toate paginile cu machetă dublă (Dashboard, Comenzi, ...) — mutat aici, era doar în dashboard.css. */
.account-preview-link {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
    text-decoration: underline dashed;
    text-underline-offset: 3px;
}

.account-preview-link:hover {
    color: var(--color-content-brand);
}

/* Buton "Înapoi la X" — fundal gri plin, doar colțuri rotunjite (NU pilulă), fără bordură; folosit pe Cum
   câștig puncte Evia ("Înapoi la Sold") ȘI Detalii comandă ("Înapoi la Comenzi") — mutat aici ca a 2-a pagină
   care îl reutilizează. NU e o variantă de .btn-neutral (alb+bordură) — fundal gri plin, altă intenție vizuală. */
.account-back-link {
    background-color: var(--color-bg-secondary);
    color: var(--color-content-primary);
    font-size: var(--text-s-size);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    transition: background-color var(--transition-fast);
}

.account-back-link:hover {
    background-color: var(--color-bg-tertiary);
    color: var(--color-content-primary);
}

/* Mobil (<768px): titlurile de secțiune devin overline mic, gri, majuscule — confirmat pe machetele mobile
   (Dashboard ȘI Punctele Evia/Cum câștig puncte Evia), diferă de Desktop/Tabletă (h2 normal, negru, mai mare) */
@media (max-width: 767.98px) {
    .account-section-title {
        font-size: var(--text-xs-size);
        line-height: var(--text-xs-line);
        font-weight: var(--font-weight-semibold);
        color: var(--color-content-tertiary);
        text-transform: uppercase;
        letter-spacing: var(--text-2xs-tracking-uppercase);
    }
}

/* Card cu listă de rânduri (icon + etichetă/valoare + acțiune), separate prin border-top — Preferințe checkout
   (Dashboard), Modalități de câștig / Nivele de fidelitate (Cum câștig puncte Evia) */
.account-preferences-list {
    border-color: var(--color-border-primary);
}

.account-preferences-item {
    border-color: var(--color-border-primary) !important;
}

.account-preferences-icon {
    width: 2.5rem;
    height: 2.5rem;
    background-color: var(--color-bg-secondary);
}

.account-preferences-label {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

.account-preferences-value {
    font-weight: var(--font-weight-semibold);
    color: var(--color-content-primary);
}

.account-preferences-tag {
    background-color: var(--color-bg-informative);
    color: var(--color-content-informative);
    font-size: var(--text-2xs-size);
    font-weight: var(--font-weight-medium);
}

/* background/border/padding sunt no-op pe <a>, dar necesare pe <button> (declanșatoarele "Schimbă"/"Adaugă"
   din Dashboard, care deschid modalele de editare — data-bs-toggle="modal") — vezi și .account-order-link */
.account-preferences-action {
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--color-content-brand);
    font-weight: var(--font-weight-medium);
    font-size: var(--text-s-size);
    white-space: nowrap;
}

/* Card de comandă (imagine + info + status, apoi rând meta alb) — Dashboard ("Comenzi recente")
   ȘI pagina Comenzi ("Toate"/filtrate); mutat aici când a devenit a doua pagină care îl folosește. */
.account-order-card {
    border-color: var(--color-border-primary);
    overflow: hidden;
}

/* Zona de sus (imagine + info comandă) — fundal gri, distinct de rândul alb de dedesubt (border-top îl separă deja) */
.account-order-top {
    background-color: var(--color-bg-secondary);
}

.account-order-number {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

.account-order-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-content-primary);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Bootstrap nu are o utilitate min-width:0 — necesară ca .account-order-title să se trunchieze
   corect într-un părinte flex (altfel elementul flex nu se micșorează sub lățimea conținutului) */
.account-order-info {
    min-width: 0;
}

.account-order-title-extra {
    font-weight: var(--font-weight-regular);
    color: var(--color-content-tertiary);
}

/* Status comandă — text simplu colorat, fără pastilă (implicit); `-pill` adaugă fundal pentru stările
   de excepție (Parțial expediată/Anulată), cerute cu accent vizual mai puternic în design */
.account-order-status {
    font-size: var(--text-s-size);
    font-weight: var(--font-weight-medium);
}

.account-order-status-positive {
    color: var(--color-content-positive-secondary);
}

.account-order-status-informative {
    color: var(--color-content-informative);
}

.account-order-status-warning {
    color: var(--color-content-warning-primary);
}

.account-order-status-warning-pill {
    color: var(--color-content-warning-primary);
    background-color: var(--color-bg-warning);
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-sm);
}

.account-order-status-negative-pill {
    color: var(--color-content-negative-secondary);
    background-color: var(--color-bg-negative);
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-sm);
}

.account-order-meta {
    border-color: var(--color-border-primary) !important;
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* background/border/padding sunt no-op pe <a> (deja fără ele implicit), dar necesare pe <button>
   (declanșatorul "Returnează" din Retururi, care are nevoie de data-bs-toggle="modal") — fără ele,
   chrome-ul nativ de buton (bordură/fundal/padding) apărea peste stilul de link din machetă */
.account-order-link {
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--color-content-brand);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
}

/* Stare fără comenzi încă (Dashboard "Prima ta comandă" / Comenzi "Nicio comandă încă") */
.account-order-empty-icon {
    width: 3.5rem;
    height: 3.5rem;
    background-color: var(--color-bg-secondary);
}

.account-order-empty-title {
    font-weight: var(--font-weight-semibold);
    font-size: var(--text-m-size);
    color: var(--color-content-primary);
}

.account-order-empty-text {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* Text meta secundar (număr retur/comandă, dată, preț, adresă) — Retururi ȘI Setări cont */
.account-meta-text {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* Citat italic (motiv recenzie / motiv retur) — Recenzii ȘI Detalii retur */
.account-quote {
    border-color: var(--color-border-primary) !important;
    color: var(--color-content-primary);
    font-style: italic;
}

/* ===== Tracking vertical (pași cu marker rotund + linie de legătură) — Detalii comandă ȘI Detalii retur,
   mutat aici când Detalii retur a devenit al 2-lea consumator ===== */

.order-tracking-card {
    border-color: var(--color-border-primary);
}

.order-tracking-item {
    position: relative;
    display: flex;
    gap: 0.75rem;
    padding-bottom: 1.75rem;
}

.order-tracking-item-last {
    padding-bottom: 0;
}

/* linia verticală care leagă marker-ul curent de următorul */
.order-tracking-item:not(.order-tracking-item-last)::after {
    content: "";
    position: absolute;
    left: 1.125rem;
    top: 2.25rem;
    bottom: 0;
    width: 2px;
    background-color: var(--color-border-primary);
}

.order-tracking-marker {
    width: 2.25rem;
    height: 2.25rem;
    position: relative;
    z-index: 1;
    background-color: var(--color-bg-secondary);
}

.order-tracking-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-content-primary);
}

.order-tracking-subtitle {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

/* Confirmat (bifă verde) */
.order-tracking-item-done-check .order-tracking-marker {
    background-color: var(--color-bg-positive);
}

/* Expediat (camion albastru) */
.order-tracking-item-done-shipped .order-tracking-marker {
    background-color: var(--color-bg-informative);
}

/* Pasul cel mai recent atins, tip pozitiv/confirmare (verde plin) — Detalii comandă ("Produse livrate") */
.order-tracking-item-current .order-tracking-marker {
    background-color: var(--color-content-positive-primary);
}

/* Pasul cel mai recent atins, tip programare/etapă activă (albastru plin) — Detalii retur
   ("Ridicare programată"), distinct de -current (verde) fiindcă nu e o confirmare finală */
.order-tracking-item-current-info .order-tracking-marker {
    background-color: var(--color-bg-brand);
}

/* În așteptare/viitor — gri, text estompat */
.order-tracking-item-pending .order-tracking-marker {
    background-color: var(--color-bg-secondary);
}

.order-tracking-item-pending .order-tracking-title,
.order-tracking-item-pending .order-tracking-subtitle {
    color: var(--color-content-tertiary);
}