/* =========================================================
   tokens.css — 양산형 디자인 토큰 (자동 생성)
   - 마지막 생성: 2026-08-07 00:00:00
   - 색상 프리셋: gold (화이트 + 골드 럭셔리)
   - 납품 페이지(/cignatureV2/_super/)에서 색상 변경 시 이 파일이 재생성됨
   - 모든 페이지가 head 마지막에서 link → cascade로 다른 :root 정의 덮어씀
========================================================= */

:root {
    /* ── 의미론적 토큰 (사용 권장) ───────────────────────── */
    --brand-bg:            #fdfbf6;
    --brand-bg-2:          #f5f2e9;
    --brand-card:          #ffffff;
    --brand-card-2:        #fdfaf2;
    --brand-card-hover:    #fbf7ec;
    --brand-header-bg:     rgba(253,251,246,0.92);

    --brand-border:        #eae1cb;
    --brand-border-strong: #d4af37;

    --brand-text:          #2b2317;
    --brand-text-2:        #6d5f45;
    --brand-text-3:        #a3977c;

    --brand-accent:        #b8860b;
    --brand-accent-2:      #d4af37;
    --brand-accent-lt:     #edd688;
    --brand-accent-bg:     #f9f1da;
    --brand-accent-text:   #8a6508;

    --brand-shadow-sm:     0 1px 4px rgba(160,125,45,0.08);
    --brand-shadow-md:     0 4px 18px rgba(160,125,45,0.12);
    --brand-shadow-lg:     0 24px 64px rgba(160,125,45,0.18);
    --brand-shadow-header: 0 2px 12px rgba(160,125,45,0.10);

    --brand-error-bg:      #fdf2f2;
    --brand-error-border:  #f5c2c2;
    --brand-error-text:    #c0392b;

    --brand-success-bg:    rgba(80,180,160,0.12);
    --brand-success-text:  #2e8a72;

    /* ── 헤더 / 레이아웃 치수 ────────────────────────────── */
    --topbar-h:            52px;
    --navbar-h:            36px;
    --tabbar-h:            44px;
    --header-h:            calc(var(--topbar-h) + var(--navbar-h) + var(--tabbar-h));
    --header-h-noinner:    calc(var(--topbar-h) + var(--navbar-h));
    --panel-w:             180px;

    /* ── cignatureV2 / 골드 톤 페이지 호환 alias ─────────── */
    --bg:        var(--brand-bg);
    --bg2:       var(--brand-bg-2);
    --bg-card:   var(--brand-card);
    --bg-header: var(--brand-header-bg);
    --bg-panel:  var(--brand-card);
    --bd:        var(--brand-border);
    --bd-s:      var(--brand-border-strong);
    --t1:        var(--brand-text);
    --t2:        var(--brand-text-2);
    --t3:        var(--brand-text-3);
    --ac:        var(--brand-accent);
    --ac-bg:     var(--brand-accent-bg);
    --ac-txt:    var(--brand-accent-text);
    --lav:       var(--brand-accent);
    --lav-lt:    var(--brand-accent-bg);
    --lav-mid:   var(--brand-accent-2);
    --gold:      var(--brand-accent);
    --gold-deep: var(--brand-accent-text);
    --gold-lt:   var(--brand-accent-lt);
    --sh-sm:     var(--brand-shadow-sm);
    --sh-md:     var(--brand-shadow-md);
    --sh-lg:     var(--brand-shadow-lg);
    --sh-header: var(--brand-shadow-header);

    /* ── template.php / 메인 페이지 호환 alias ───────────── */
    --lavender:        var(--brand-accent);
    --lavender-mid:    var(--brand-accent-2);
    --lavender-deep:   var(--brand-accent-text);
    --silver:          #d3ccba;
    --silver-light:    #ece7d9;
    --silver-dark:     #97907d;
    --border:          var(--brand-border);
    --border-hover:    var(--brand-border-strong);
    --text-primary:    var(--brand-text);
    --text-secondary:  var(--brand-text-2);
    --text-muted:      var(--brand-text-3);
    --bg-card2:        var(--brand-card-2);
    --controls-bg:     var(--brand-header-bg);
    --url-color:       var(--brand-text-2);
    --btn-color:       var(--brand-text-2);

    /* ── auth/login.css 호환 alias ───────────────────────── */
    --accent:          var(--brand-accent);
    --accent-lt:       var(--brand-accent-bg);
    --border-focus:    var(--brand-accent-2);
    --text-1:          var(--brand-text);
    --text-2:          var(--brand-text-2);
    --text-3:          var(--brand-text-3);
    --error-bg:        var(--brand-error-bg);
    --error-border:    var(--brand-error-border);
    --error-text:      var(--brand-error-text);
    --shadow:          var(--brand-shadow-sm);
    --shadow-lg:       var(--brand-shadow-lg);
}

[data-theme="dark"] {
    --brand-bg:            #0f0d08;
    --brand-bg-2:          #16130c;
    --brand-card:          #16130c;
    --brand-card-2:        #1b1710;
    --brand-card-hover:    #1f1a11;
    --brand-header-bg:     rgba(15,13,8,0.92);

    --brand-border:        rgba(212,175,55,0.16);
    --brand-border-strong: #d4af37;

    --brand-text:          #ffffff;
    --brand-text-2:        #d5ccb6;
    --brand-text-3:        #90866e;

    --brand-accent:        #d4af37;
    --brand-accent-2:      #edd688;
    --brand-accent-lt:     #f9f1da;
    --brand-accent-bg:     rgba(212,175,55,0.10);
    --brand-accent-text:   #edd688;

    --brand-shadow-sm:     0 1px 4px rgba(0,0,0,0.35);
    --brand-shadow-md:     0 4px 18px rgba(0,0,0,0.45);
    --brand-shadow-lg:     0 24px 64px rgba(0,0,0,0.55);
    --brand-shadow-header: 0 2px 12px rgba(0,0,0,0.50);

    --brand-error-bg:      rgba(220,38,38,0.08);
    --brand-error-border:  rgba(220,38,38,0.25);
    --brand-error-text:    #f87171;
}
