/**
 * Salles & Mendes Advocacia - Design System
 * Prefixo: .sm-*
 * Funciona standalone (com ou sem Tailwind), preserva o tema navy royal + dourado champagne classico
 *
 * Paleta:
 *   navy:    #0D1B40 (700) / #08122A (900) / #1A2B5C (600) / #1F3068 (500)
 *   gold:    #C9A961 (500) / #D4B97A (400) / #B8945F (600) / #E8D4A0 (300)
 *   cream:   #F5EFE6 (100) / #FAF7F1 (50)
 *   ink:     #1A1F2E (texto principal)
 *
 * Princípio: estado ativo navy escuro + acento dourado lateral, nunca fundo dourado pleno.
 * Espirito: autoridade classica, mesa do escritorio, nao sci-fi.
 */

/* ============================================================
 * Base tokens (independentes do style.css)
 * ============================================================ */
:root {
    --sm-navy-900:#08122A;
    --sm-navy-700:#0D1B40;
    --sm-navy-600:#1A2B5C;
    --sm-navy-500:#1F3068;
    --sm-gold-600:#B8945F;
    --sm-gold-500:#C9A961;
    --sm-gold-400:#D4B97A;
    --sm-gold-300:#E8D4A0;
    --sm-cream-100:#F5EFE6;
    --sm-cream-50:#FAF7F1;
    --sm-ink:#1A1F2E;
    --sm-mute:#6B7280;
    --sm-line:rgba(13,27,64,0.08);
    --sm-line-strong:rgba(13,27,64,0.16);

    --sm-radius-sm:8px;
    --sm-radius:14px;
    --sm-radius-lg:22px;

    --sm-shadow-sm:0 2px 8px rgba(13,27,64,0.06);
    --sm-shadow:0 10px 30px -12px rgba(13,27,64,0.18), 0 4px 14px -8px rgba(13,27,64,0.08);
    --sm-shadow-lg:0 30px 60px -20px rgba(8,18,42,0.30), 0 12px 24px -10px rgba(13,27,64,0.12);
    --sm-shadow-gold:0 12px 28px -10px rgba(201,169,97,0.45);

    --sm-trans:200ms cubic-bezier(.2,.7,.2,1);
}

/* ============================================================
 * .sm-card
 * ============================================================ */
.sm-card{
    background:#ffffff;
    border:1px solid var(--sm-line);
    border-radius:var(--sm-radius);
    padding:1.25rem;
    box-shadow:var(--sm-shadow-sm);
    transition:transform var(--sm-trans), box-shadow var(--sm-trans), border-color var(--sm-trans);
    position:relative;
}
.sm-card:hover{
    box-shadow:var(--sm-shadow);
    border-color:var(--sm-line-strong);
}
.sm-card--pad-lg{ padding:1.75rem; }
.sm-card--pad-sm{ padding:0.875rem; }
.sm-card--hover-lift:hover{ transform:translateY(-3px); }

.sm-card--dark{
    background:linear-gradient(135deg, var(--sm-navy-900) 0%, var(--sm-navy-700) 100%);
    border-color:rgba(255,255,255,0.06);
    color:#fff;
}
.sm-card--dark .sm-card__title{ color:#fff; }
.sm-card--dark .sm-card__sub{ color:rgba(255,255,255,0.65); }

.sm-card--gold{
    background:linear-gradient(135deg, var(--sm-gold-500) 0%, var(--sm-gold-400) 100%);
    border-color:transparent;
    color:var(--sm-navy-900);
    box-shadow:var(--sm-shadow-gold);
}

.sm-card--glass{
    background:rgba(255,255,255,0.65);
    backdrop-filter:saturate(140%) blur(14px);
    -webkit-backdrop-filter:saturate(140%) blur(14px);
    border-color:rgba(255,255,255,0.6);
}
.sm-card--glass-dark{
    background:rgba(13,27,64,0.55);
    backdrop-filter:saturate(140%) blur(14px);
    -webkit-backdrop-filter:saturate(140%) blur(14px);
    border-color:rgba(255,255,255,0.08);
    color:#fff;
}

.sm-card__head{ display:flex; align-items:center; gap:.75rem; margin-bottom:.75rem; }
.sm-card__title{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-size:1.15rem;
    color:var(--sm-navy-900);
    margin:0;
    font-weight:600;
    letter-spacing:.005em;
}
.sm-card__sub{ font-size:.78rem; color:var(--sm-mute); margin-top:.15rem; }

.sm-card--top-gold::before{
    content:'';
    position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, transparent, var(--sm-gold-500), transparent);
    border-radius:var(--sm-radius) var(--sm-radius) 0 0;
}

/* ============================================================
 * .sm-btn
 * ============================================================ */
.sm-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
    padding:.7rem 1.15rem;
    border-radius:10px;
    font-weight:600;
    font-size:.9rem;
    line-height:1;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform var(--sm-trans), box-shadow var(--sm-trans), background var(--sm-trans), color var(--sm-trans), border-color var(--sm-trans);
    text-decoration:none;
    white-space:nowrap;
    user-select:none;
}
.sm-btn:disabled,
.sm-btn[aria-disabled="true"]{ opacity:.55; cursor:not-allowed; transform:none !important; }
.sm-btn:focus-visible{ outline:2px solid var(--sm-gold-500); outline-offset:2px; }

.sm-btn--primary{
    background:linear-gradient(135deg, var(--sm-navy-900), var(--sm-navy-700));
    color:#fff;
    border-color:var(--sm-navy-700);
    box-shadow:var(--sm-shadow-sm);
}
.sm-btn--primary:hover{ transform:translateY(-1px); box-shadow:var(--sm-shadow); }

.sm-btn--gold{
    background:linear-gradient(135deg, var(--sm-gold-500), var(--sm-gold-400));
    color:var(--sm-navy-900);
    border-color:var(--sm-gold-600);
    box-shadow:var(--sm-shadow-gold);
}
.sm-btn--gold:hover{ transform:translateY(-1px); filter:brightness(1.04); }

.sm-btn--secondary{
    background:#fff;
    color:var(--sm-navy-900);
    border-color:var(--sm-line-strong);
}
.sm-btn--secondary:hover{ border-color:var(--sm-gold-500); color:var(--sm-navy-700); }

.sm-btn--ghost{ background:transparent; color:var(--sm-navy-700); border-color:transparent; }
.sm-btn--ghost:hover{ background:var(--sm-cream-50); color:var(--sm-navy-900); }

.sm-btn--danger{
    background:#fff;
    color:#b91c1c;
    border-color:rgba(185,28,28,0.3);
}
.sm-btn--danger:hover{ background:#fef2f2; border-color:#b91c1c; }

.sm-btn--sm{ padding:.5rem .85rem; font-size:.8rem; border-radius:8px; }
.sm-btn--lg{ padding:.95rem 1.5rem; font-size:1rem; border-radius:12px; }
.sm-btn--block{ display:flex; width:100%; }
.sm-btn--icon{ padding:.55rem; width:2.4rem; height:2.4rem; }
.sm-btn--icon.sm-btn--sm{ width:2rem; height:2rem; padding:.35rem; }

/* ============================================================
 * .sm-stat
 * ============================================================ */
.sm-stat{
    display:flex; flex-direction:column; gap:.35rem;
    padding:1.1rem 1.25rem;
    background:#fff;
    border:1px solid var(--sm-line);
    border-radius:var(--sm-radius);
    box-shadow:var(--sm-shadow-sm);
    position:relative;
    overflow:hidden;
    transition:transform var(--sm-trans), box-shadow var(--sm-trans);
}
.sm-stat:hover{ transform:translateY(-2px); box-shadow:var(--sm-shadow); }
.sm-stat__label{
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--sm-mute);
    font-weight:600;
}
.sm-stat__value{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-size:2rem;
    color:var(--sm-navy-900);
    line-height:1;
    font-weight:700;
    letter-spacing:-.005em;
}
.sm-stat__sub{ font-size:.78rem; color:var(--sm-mute); display:flex; align-items:center; gap:.35rem; }
.sm-stat__delta--up{ color:#15803d; font-weight:600; }
.sm-stat__delta--down{ color:#b91c1c; font-weight:600; }

.sm-stat--gold{
    background:linear-gradient(135deg, var(--sm-cream-50), #fff);
    border-color:rgba(201,169,97,0.25);
}
.sm-stat--gold .sm-stat__value{
    background:linear-gradient(135deg, var(--sm-gold-600), var(--sm-gold-500));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sm-stat--dark{
    background:linear-gradient(135deg, var(--sm-navy-900), var(--sm-navy-700));
    border-color:transparent; color:#fff;
}
.sm-stat--dark .sm-stat__label{ color:rgba(255,255,255,0.6); }
.sm-stat--dark .sm-stat__value{ color:#fff; }
.sm-stat--dark .sm-stat__sub{ color:rgba(255,255,255,0.55); }

.sm-stat__icon{
    position:absolute; top:.85rem; right:.85rem;
    width:36px; height:36px;
    display:flex; align-items:center; justify-content:center;
    border-radius:10px;
    background:linear-gradient(135deg, var(--sm-gold-500), var(--sm-gold-400));
    color:var(--sm-navy-900);
    box-shadow:0 6px 14px -6px rgba(201,169,97,0.5);
}
.sm-stat--dark .sm-stat__icon{
    background:rgba(255,255,255,0.1);
    color:var(--sm-gold-400);
    box-shadow:none;
}

/* ============================================================
 * .sm-pill
 * ============================================================ */
.sm-pill{
    display:inline-flex; align-items:center; gap:.35rem;
    padding:.25rem .65rem;
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.02em;
    border-radius:999px;
    background:var(--sm-cream-50);
    color:var(--sm-navy-700);
    border:1px solid var(--sm-line);
    line-height:1.2;
    white-space:nowrap;
}
.sm-pill--gold{ background:linear-gradient(135deg, var(--sm-gold-500), var(--sm-gold-400)); color:var(--sm-navy-900); border-color:transparent; }
.sm-pill--navy{ background:var(--sm-navy-900); color:#fff; border-color:transparent; }
.sm-pill--green{ background:#dcfce7; color:#15803d; border-color:rgba(21,128,61,0.2); }
.sm-pill--red{ background:#fee2e2; color:#b91c1c; border-color:rgba(185,28,28,0.2); }
.sm-pill--blue{ background:#dbeafe; color:#1d4ed8; border-color:rgba(29,78,216,0.2); }
.sm-pill--amber{ background:#fef3c7; color:#92400e; border-color:rgba(146,64,14,0.2); }
.sm-pill--mute{ background:#f1f3f8; color:var(--sm-mute); border-color:transparent; }
.sm-pill--outline{ background:transparent; }
.sm-pill--dot::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.7; }

/* ============================================================
 * .sm-input / textarea / select / field
 * ============================================================ */
.sm-input,
.sm-textarea,
.sm-select{
    width:100%;
    padding:.7rem .9rem;
    background:#fff;
    border:1px solid var(--sm-line-strong);
    border-radius:10px;
    font-size:.9rem;
    color:var(--sm-ink);
    transition:border-color var(--sm-trans), box-shadow var(--sm-trans), background var(--sm-trans);
    font-family:inherit;
}
.sm-input:hover, .sm-textarea:hover, .sm-select:hover{ border-color:rgba(13,27,64,0.28); }
.sm-input:focus, .sm-textarea:focus, .sm-select:focus{
    outline:none;
    border-color:var(--sm-gold-500);
    box-shadow:0 0 0 3px rgba(201,169,97,0.18);
}
.sm-input::placeholder, .sm-textarea::placeholder{ color:var(--sm-mute); opacity:.7; }
.sm-textarea{ min-height:96px; resize:vertical; line-height:1.5; }

.sm-select{
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230D1B40' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right .85rem center;
    padding-right:2.25rem;
}

.sm-field{ display:flex; flex-direction:column; gap:.35rem; }
.sm-field__label{ font-size:.78rem; font-weight:600; color:var(--sm-navy-700); letter-spacing:.01em; }
.sm-field__hint{ font-size:.72rem; color:var(--sm-mute); }
.sm-field__error{ font-size:.74rem; color:#b91c1c; }
.sm-field--error .sm-input,
.sm-field--error .sm-textarea,
.sm-field--error .sm-select{
    border-color:#b91c1c;
    box-shadow:0 0 0 3px rgba(185,28,28,0.12);
}

/* ============================================================
 * .sm-table
 * ============================================================ */
.sm-table-wrap{
    background:#fff;
    border:1px solid var(--sm-line);
    border-radius:var(--sm-radius);
    overflow:hidden;
    box-shadow:var(--sm-shadow-sm);
}
.sm-table{ width:100%; border-collapse:collapse; font-size:.88rem; }
.sm-table thead{
    background:linear-gradient(135deg, var(--sm-navy-900), var(--sm-navy-700));
    color:#fff;
}
.sm-table thead th{
    padding:.85rem 1rem;
    text-align:left;
    font-weight:600;
    font-size:.74rem;
    text-transform:uppercase;
    letter-spacing:.08em;
    border-bottom:2px solid var(--sm-gold-500);
}
.sm-table tbody td{
    padding:.85rem 1rem;
    border-bottom:1px solid var(--sm-line);
    color:var(--sm-ink);
    vertical-align:middle;
}
.sm-table tbody tr{ transition:background var(--sm-trans); }
.sm-table tbody tr:hover{ background:var(--sm-cream-50); }
.sm-table tbody tr:last-child td{ border-bottom:none; }
.sm-table--compact thead th{ padding:.6rem .85rem; }
.sm-table--compact tbody td{ padding:.6rem .85rem; }

/* ============================================================
 * .sm-section-head
 * ============================================================ */
.sm-section-head{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.25rem; }
.sm-section-head__eyebrow{
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.16em;
    color:var(--sm-gold-600);
    font-weight:700;
    display:inline-flex; align-items:center; gap:.5rem;
}
.sm-section-head__eyebrow::before{ content:''; width:18px; height:1px; background:var(--sm-gold-500); }
.sm-section-head__title{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-size:1.85rem;
    color:var(--sm-navy-900);
    margin:0;
    font-weight:700;
    letter-spacing:-.005em;
    line-height:1.2;
}
.sm-section-head__sub{ color:var(--sm-mute); font-size:.95rem; max-width:60ch; line-height:1.5; }
.sm-section-head--center{ align-items:center; text-align:center; }
.sm-section-head--center .sm-section-head__sub{ margin:0 auto; }

/* ============================================================
 * .sm-empty / alerts / divider / tooltip
 * ============================================================ */
.sm-empty{
    text-align:center;
    padding:3rem 1.5rem;
    background:#fff;
    border:1.5px dashed var(--sm-line-strong);
    border-radius:var(--sm-radius);
}
.sm-empty__icon{
    width:60px; height:60px; margin:0 auto 1rem;
    border-radius:14px;
    background:var(--sm-cream-50);
    color:var(--sm-gold-600);
    display:flex; align-items:center; justify-content:center;
}
.sm-empty__title{
    font-family:'Cormorant Garamond', Georgia, serif;
    color:var(--sm-navy-900);
    font-size:1.25rem;
    margin-bottom:.35rem;
    font-weight:600;
}
.sm-empty__sub{ color:var(--sm-mute); font-size:.88rem; max-width:42ch; margin:0 auto .9rem; }

.sm-divider{
    height:1px;
    background:linear-gradient(90deg, transparent, var(--sm-line-strong), transparent);
    margin:1.5rem 0;
    border:0;
}
.sm-divider--gold{
    background:linear-gradient(90deg, transparent, var(--sm-gold-500), transparent);
}

.sm-tooltip{ position:relative; display:inline-flex; }
.sm-tooltip[data-tip]:hover::after,
.sm-tooltip[data-tip]:focus-visible::after{
    content:attr(data-tip);
    position:absolute;
    bottom:calc(100% + 8px); left:50%;
    transform:translateX(-50%);
    background:var(--sm-navy-900);
    color:#fff;
    padding:.4rem .6rem;
    border-radius:6px;
    font-size:.72rem;
    white-space:nowrap;
    box-shadow:var(--sm-shadow);
    pointer-events:none;
    z-index:60;
}
.sm-tooltip[data-tip]:hover::before,
.sm-tooltip[data-tip]:focus-visible::before{
    content:'';
    position:absolute;
    bottom:calc(100% + 2px); left:50%;
    transform:translateX(-50%) rotate(45deg);
    width:8px; height:8px;
    background:var(--sm-navy-900);
    pointer-events:none;
    z-index:60;
}

/* ============================================================
 * .sm-avatar / .sm-icon-box
 * ============================================================ */
.sm-avatar{
    width:40px; height:40px;
    border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    font-weight:700;
    font-size:.85rem;
    color:var(--sm-navy-900);
    background:linear-gradient(135deg, var(--sm-gold-400), var(--sm-gold-500));
    border:2px solid #fff;
    box-shadow:var(--sm-shadow-sm);
    flex-shrink:0;
    text-transform:uppercase;
    letter-spacing:.02em;
    overflow:hidden;
}
.sm-avatar img{ width:100%; height:100%; object-fit:cover; }
.sm-avatar--sm{ width:30px; height:30px; font-size:.7rem; }
.sm-avatar--lg{ width:56px; height:56px; font-size:1.05rem; }
.sm-avatar--xl{ width:80px; height:80px; font-size:1.45rem; border-width:3px; }
.sm-avatar--navy{ background:linear-gradient(135deg, var(--sm-navy-700), var(--sm-navy-900)); color:#fff; }
.sm-avatar--cream{ background:var(--sm-cream-100); color:var(--sm-navy-900); }

.sm-avatar-stack{ display:inline-flex; align-items:center; }
.sm-avatar-stack > .sm-avatar:not(:first-child){ margin-left:-.6rem; }

.sm-icon-box{
    width:42px; height:42px;
    border-radius:12px;
    background:linear-gradient(135deg, var(--sm-gold-500), var(--sm-gold-400));
    color:var(--sm-navy-900);
    display:inline-flex; align-items:center; justify-content:center;
    flex-shrink:0;
    box-shadow:0 6px 14px -6px rgba(201,169,97,0.5);
}
.sm-icon-box--sm{ width:32px; height:32px; border-radius:9px; }
.sm-icon-box--lg{ width:56px; height:56px; border-radius:14px; }
.sm-icon-box--navy{
    background:linear-gradient(135deg, var(--sm-navy-700), var(--sm-navy-900));
    color:var(--sm-gold-400);
    box-shadow:0 6px 14px -6px rgba(13,27,64,0.5);
}
.sm-icon-box--ghost{
    background:var(--sm-cream-50);
    color:var(--sm-navy-700);
    box-shadow:none;
    border:1px solid var(--sm-line);
}
.sm-icon-box--green{ background:linear-gradient(135deg,#15803d,#22c55e); color:#fff; box-shadow:0 6px 14px -6px rgba(21,128,61,0.5); }
.sm-icon-box--red{ background:linear-gradient(135deg,#b91c1c,#ef4444); color:#fff; box-shadow:0 6px 14px -6px rgba(185,28,28,0.5); }
.sm-icon-box--blue{ background:linear-gradient(135deg,#1d4ed8,#3b82f6); color:#fff; box-shadow:0 6px 14px -6px rgba(29,78,216,0.5); }

/* ============================================================
 * Utilitarios + alerts + tabs + timeline + progress + switch
 * ============================================================ */
.sm-glass{
    background:rgba(255,255,255,0.55);
    backdrop-filter:saturate(140%) blur(14px);
    -webkit-backdrop-filter:saturate(140%) blur(14px);
    border:1px solid rgba(255,255,255,0.6);
    border-radius:var(--sm-radius);
}
.sm-glass--dark{
    background:rgba(13,27,64,0.55);
    backdrop-filter:saturate(140%) blur(14px);
    -webkit-backdrop-filter:saturate(140%) blur(14px);
    border-color:rgba(255,255,255,0.08);
    color:#fff;
}
.sm-gradient-text{
    background:linear-gradient(135deg, var(--sm-gold-600), var(--sm-gold-400));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sm-gradient-text--navy{
    background:linear-gradient(135deg, var(--sm-navy-900), var(--sm-navy-600));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sm-link{
    color:var(--sm-navy-700);
    font-weight:600;
    text-decoration:none;
    border-bottom:1px solid var(--sm-gold-500);
    transition:color var(--sm-trans), border-color var(--sm-trans);
}
.sm-link:hover{ color:var(--sm-navy-900); border-color:var(--sm-gold-600); }

.sm-eyebrow{
    display:inline-flex; align-items:center; gap:.5rem;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.16em;
    color:var(--sm-gold-600);
    font-weight:700;
}
.sm-eyebrow::before{ content:''; width:18px; height:1px; background:var(--sm-gold-500); }

.sm-kbd{
    display:inline-block;
    padding:.15rem .4rem;
    font-family:'JetBrains Mono', ui-monospace, monospace;
    font-size:.72rem;
    background:#fff;
    border:1px solid var(--sm-line-strong);
    border-bottom-width:2px;
    border-radius:5px;
    color:var(--sm-navy-700);
    line-height:1;
}
.sm-code{
    font-family:'JetBrains Mono', ui-monospace, monospace;
    font-size:.78rem;
    background:var(--sm-cream-50);
    color:var(--sm-navy-900);
    padding:.12rem .4rem;
    border-radius:5px;
    border:1px solid var(--sm-line);
}

.sm-progress{
    width:100%;
    height:8px;
    background:var(--sm-cream-100);
    border-radius:999px;
    overflow:hidden;
    position:relative;
}
.sm-progress__bar{
    height:100%;
    background:linear-gradient(90deg, var(--sm-gold-500), var(--sm-gold-400));
    border-radius:999px;
    transition:width 600ms cubic-bezier(.2,.7,.2,1);
}
.sm-progress--navy .sm-progress__bar{
    background:linear-gradient(90deg, var(--sm-navy-700), var(--sm-navy-900));
}

.sm-switch{ position:relative; display:inline-block; width:42px; height:24px; }
.sm-switch input{ opacity:0; width:0; height:0; }
.sm-switch__slider{
    position:absolute; cursor:pointer;
    top:0; left:0; right:0; bottom:0;
    background:#cbd5e1;
    border-radius:999px;
    transition:background var(--sm-trans);
}
.sm-switch__slider::before{
    content:'';
    position:absolute;
    height:18px; width:18px;
    left:3px; bottom:3px;
    background:#fff;
    border-radius:50%;
    box-shadow:var(--sm-shadow-sm);
    transition:transform var(--sm-trans);
}
.sm-switch input:checked + .sm-switch__slider{
    background:linear-gradient(135deg, var(--sm-gold-500), var(--sm-gold-400));
}
.sm-switch input:checked + .sm-switch__slider::before{ transform:translateX(18px); }

.sm-alert{
    display:flex; gap:.75rem;
    padding:.85rem 1.05rem;
    border-radius:12px;
    border:1px solid var(--sm-line);
    background:#fff;
    align-items:flex-start;
    font-size:.88rem;
    line-height:1.5;
}
.sm-alert__icon{ flex-shrink:0; margin-top:.1rem; }
.sm-alert__title{ font-weight:600; color:var(--sm-navy-900); margin-bottom:.15rem; }
.sm-alert__body{ color:var(--sm-mute); }

.sm-alert--info{ background:#eff6ff; border-color:rgba(29,78,216,0.2); }
.sm-alert--info .sm-alert__icon{ color:#1d4ed8; }
.sm-alert--success{ background:#f0fdf4; border-color:rgba(21,128,61,0.2); }
.sm-alert--success .sm-alert__icon{ color:#15803d; }
.sm-alert--warn{ background:#fffbeb; border-color:rgba(146,64,14,0.2); }
.sm-alert--warn .sm-alert__icon{ color:#b45309; }
.sm-alert--error{ background:#fef2f2; border-color:rgba(185,28,28,0.2); }
.sm-alert--error .sm-alert__icon{ color:#b91c1c; }
.sm-alert--gold{
    background:linear-gradient(135deg, var(--sm-cream-50), #fff);
    border-color:rgba(201,169,97,0.3);
}
.sm-alert--gold .sm-alert__icon{ color:var(--sm-gold-600); }

.sm-tabs{
    display:flex; gap:.25rem;
    border-bottom:1px solid var(--sm-line);
    overflow-x:auto;
}
.sm-tab{
    padding:.7rem 1.05rem;
    background:transparent;
    border:none;
    border-bottom:2px solid transparent;
    color:var(--sm-mute);
    font-size:.88rem;
    font-weight:500;
    cursor:pointer;
    transition:color var(--sm-trans), border-color var(--sm-trans);
    white-space:nowrap;
    text-decoration:none;
}
.sm-tab:hover{ color:var(--sm-navy-700); }
.sm-tab.is-active{
    color:var(--sm-navy-900);
    border-bottom-color:var(--sm-gold-500);
    font-weight:600;
}

.sm-timeline{ position:relative; padding-left:1.5rem; }
.sm-timeline::before{
    content:'';
    position:absolute;
    left:.45rem; top:.4rem; bottom:.4rem;
    width:2px;
    background:linear-gradient(180deg, var(--sm-gold-500), transparent);
}
.sm-timeline__item{ position:relative; padding-bottom:1.1rem; }
.sm-timeline__item::before{
    content:'';
    position:absolute;
    left:-1.05rem; top:.35rem;
    width:10px; height:10px;
    border-radius:50%;
    background:var(--sm-gold-500);
    box-shadow:0 0 0 3px rgba(201,169,97,0.2);
}
.sm-timeline__time{
    font-size:.72rem;
    color:var(--sm-mute);
    text-transform:uppercase;
    letter-spacing:.06em;
    font-weight:600;
}
.sm-timeline__title{ color:var(--sm-navy-900); font-weight:600; font-size:.92rem; margin:.1rem 0 .15rem; }
.sm-timeline__body{ color:var(--sm-mute); font-size:.85rem; line-height:1.5; }

@keyframes sm-skeleton-shine{
    0%{ background-position:-200px 0; }
    100%{ background-position:calc(200px + 100%) 0; }
}
.sm-skeleton{
    background:linear-gradient(90deg, #eef2f7 0%, #f7f9fc 50%, #eef2f7 100%);
    background-size:200px 100%;
    background-repeat:no-repeat;
    border-radius:8px;
    animation:sm-skeleton-shine 1.4s linear infinite;
    color:transparent !important;
    pointer-events:none;
    user-select:none;
}

@media (prefers-reduced-motion: reduce){
    .sm-card, .sm-stat, .sm-btn,
    .sm-input, .sm-textarea, .sm-select,
    .sm-progress__bar, .sm-switch__slider,
    .sm-switch__slider::before, .sm-tab{
        transition:none !important;
    }
    .sm-skeleton{ animation:none; }
}
