/* ============================================================
   Viecoto brand theme — derived from logo viecoto-logo.svg
   Logo colors:
     Primary  #1A4D8F (xanh đậm)
     Accent   #F2A03D (cam)
     Muted    #6B6B6B
   Loaded AFTER main.css in layouts/app.blade.php
   ============================================================ */

:root {
    --brand-primary:        #1A4D8F;
    --brand-primary-dark:   #143D72;
    --brand-primary-light:  #22609F;
    --brand-primary-soft:   #E8EEF7;

    --brand-accent:         #F2A03D;
    --brand-accent-dark:    #D97F1A;
    --brand-accent-light:   #F8C07A;
    --brand-accent-soft:    #FDF1E0;

    --brand-muted:          #6B6B6B;
    --brand-text:           #2D3748;
}

/* ---------- Links ---------- */
a { color: var(--brand-primary); }
a:hover,
a:focus { color: var(--brand-primary-dark); }

/* ---------- Bootstrap primary overrides ---------- */
.text-primary { color: var(--brand-primary) !important; }
.bg-primary   { background-color: var(--brand-primary) !important; }
.border-primary { border-color: var(--brand-primary) !important; }

.btn-primary {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--brand-primary-dark) !important;
    border-color: var(--brand-primary-dark) !important;
    color: #fff;
}
.btn-outline-primary {
    color: var(--brand-primary);
    border-color: var(--brand-primary);
}
.btn-outline-primary:hover {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
}

/* ---------- Accent (CTA cam) ---------- */
.btn-warning,
.btn-accent {
    background-color: var(--brand-accent);
    border-color: var(--brand-accent);
    color: #fff;
}
.btn-warning:hover,
.btn-accent:hover {
    background-color: var(--brand-accent-dark);
    border-color: var(--brand-accent-dark);
    color: #fff;
}

/* ---------- Nav / navbar tweaks (theo selectors thấy trong main.css) ---------- */
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus { color: var(--brand-primary-dark); }
.navbar-expand-lg .navbar-nav .nav-item.loginbtn a { background: var(--brand-accent); }
.navbar-expand-lg .navbar-nav .nav-item.loginbtn a:hover { background: var(--brand-accent-dark); }

/* ---------- Form focus ---------- */
.form-control:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--brand-primary-light);
    box-shadow: 0 0 0 0.15rem rgba(26, 77, 143, 0.18);
    outline: none;
}

/* ---------- Common green-to-accent remap (greens lệch logo) ---------- */
/* Login/secondary CTAs that were green — kéo về accent */
.btn-success { /* leave success status meaning untouched */ }

/* ---------- Footer / dark sections that previously used #2c3e50 stay,
   but tô đồng bộ nếu xuất hiện màu xanh sáng lệch ---------- */

/* ---------- Headings underline / dividers ---------- */
hr.brand,
.section-divider {
    border-top: 2px solid var(--brand-primary);
    opacity: 1;
}

/* ---------- Selection ---------- */
::selection { background: var(--brand-primary); color: #fff; }