/* =====================================================================
   TUBOSA Theme — ธีมสีฟ้า-ทอง โรงเรียนสตรีอ่างทอง
   ใช้ทับ (override) สไตล์หลักจากเทมเพลต deskapp
   ===================================================================== */
:root {
    --tb-blue-dark:  #0d2c54;   /* น้ำเงินเข้ม (พื้นเมนู) */
    --tb-blue:       #1565c0;   /* ฟ้าหลัก */
    --tb-blue-light: #42a5f5;   /* ฟ้าอ่อน */
    --tb-blue-pale:  #e8f2fc;   /* ฟ้าจางพื้นหลัง */
    --tb-gold:       #d4a017;   /* ทองหลัก */
    --tb-gold-light: #f0c419;   /* ทองสว่าง */
    --tb-gold-pale:  #fdf6e3;   /* ทองจาง */
}

body {
    font-family: 'Sarabun', 'Inter', sans-serif;
    background: #f2f6fb;
}

/* ---------- Header ---------- */
.header {
    background: linear-gradient(90deg, var(--tb-blue-dark) 0%, var(--tb-blue) 100%);
    box-shadow: 0 2px 8px rgba(13, 44, 84, .25);
}
.header .menu-icon, .header .search-toggle-icon { color: #fff; }
.header .user-name { color: #fff; }
.header .user-icon img { border: 2px solid var(--tb-gold-light); }
.header-right .dropdown-toggle { color: #fff !important; }

/* ---------- Sidebar ---------- */
.left-side-bar {
    background: linear-gradient(180deg, var(--tb-blue-dark) 0%, #123a6d 100%);
}
.left-side-bar .brand-logo {
    background: rgba(0, 0, 0, .15);
    border-bottom: 2px solid var(--tb-gold);
}
.brand-logo .school-brand {
    display: flex; align-items: center; gap: 10px;
    padding: 6px 0; color: #fff; text-decoration: none;
}
.brand-logo .school-brand .logo-badge {
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--tb-gold);
    color: var(--tb-blue-dark);
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 18px; flex: none;
}
.brand-logo .school-brand .logo-text { line-height: 1.2; }
.brand-logo .school-brand .logo-text b { font-size: 15px; color: #fff; display: block; }
.brand-logo .school-brand .logo-text span { font-size: 11px; color: var(--tb-gold-light); }
.sidebar-menu .dropdown-toggle,
.sidebar-menu li a { color: #cfe0f5 !important; }
.sidebar-menu .dropdown-toggle .micon { color: var(--tb-gold-light) !important; }
.sidebar-menu li a:hover,
.sidebar-menu li.active > a,
.sidebar-menu li > a.active {
    color: #fff !important;
    background: rgba(212, 160, 23, .18) !important;
    border-radius: 6px;
}
.sidebar-menu li > a.active .mtext { color: var(--tb-gold-light); font-weight: 600; }
.sidebar-menu .submenu li a { color: #a9c3e2 !important; }
.sidebar-menu .submenu li a:hover, .sidebar-menu .submenu li a.active { color: var(--tb-gold-light) !important; }
.sidebar-menu .menu-section-title {
    color: var(--tb-gold-light); font-size: 11px; letter-spacing: .5px;
    padding: 14px 15px 4px; text-transform: uppercase; opacity: .9;
}
.close-sidebar { color: #fff !important; }

/* ---------- Buttons / links ---------- */
.btn-primary {
    background: var(--tb-blue);
    border-color: var(--tb-blue);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background: var(--tb-blue-dark) !important;
    border-color: var(--tb-blue-dark) !important;
}
.btn-gold {
    background: var(--tb-gold); border-color: var(--tb-gold); color: #fff;
}
.btn-gold:hover { background: #b8890f; border-color: #b8890f; color: #fff; }
.btn-outline-primary { color: var(--tb-blue); border-color: var(--tb-blue); }
.btn-outline-primary:hover { background: var(--tb-blue); border-color: var(--tb-blue); }
a { color: var(--tb-blue); }
a:hover { color: var(--tb-blue-dark); }
.text-blue { color: var(--tb-blue) !important; }
.text-gold { color: var(--tb-gold) !important; }

/* ---------- Cards ---------- */
.card-box { border-radius: 10px; border: none; box-shadow: 0 2px 10px rgba(13, 44, 84, .07); }
.page-header { border-radius: 10px; }
.page-header .title h4 { color: var(--tb-blue-dark); font-weight: 700; }
.card-box .h5, .card-box h4, .card-box h5 { color: var(--tb-blue-dark); }

/* การ์ดสถิติหน้า dashboard */
.stat-card { border-left: 4px solid var(--tb-blue); }
.stat-card.gold { border-left-color: var(--tb-gold); }
.stat-card .stat-icon {
    width: 52px; height: 52px; border-radius: 12px;
    background: var(--tb-blue-pale); color: var(--tb-blue);
    display: flex; align-items: center; justify-content: center; font-size: 24px;
}
.stat-card.gold .stat-icon { background: var(--tb-gold-pale); color: var(--tb-gold); }
.stat-card .stat-num { font-size: 26px; font-weight: 700; color: var(--tb-blue-dark); }
.stat-card .stat-label { color: #7d8da6; font-size: 13px; }

/* ---------- Tables ---------- */
.table thead th {
    background: var(--tb-blue-pale);
    color: var(--tb-blue-dark);
    border-bottom: 2px solid var(--tb-blue-light);
    font-weight: 600;
}
.table-hover tbody tr:hover { background: var(--tb-gold-pale); }
.table td, .table th { vertical-align: middle; }

/* ---------- Badge ---------- */
.badge-primary { background: var(--tb-blue); }
.badge-gold { background: var(--tb-gold); color: #fff; }

/* ---------- Login ---------- */
.login-header {
    background: linear-gradient(90deg, var(--tb-blue-dark), var(--tb-blue));
}
.login-page-bg {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--tb-blue-dark) 0%, var(--tb-blue) 55%, var(--tb-gold) 140%);
}
.login-box { border-top: 4px solid var(--tb-gold); }
.login-title h2 { color: var(--tb-blue-dark); font-weight: 700; }
.login-school-badge {
    width: 84px; height: 84px; border-radius: 50%;
    background: linear-gradient(135deg, var(--tb-gold), var(--tb-gold-light));
    color: var(--tb-blue-dark); font-size: 34px; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 12px; box-shadow: 0 4px 14px rgba(212, 160, 23, .45);
}

/* ---------- ตารางคะแนนนิเทศ ---------- */
.eval-domain-row td {
    background: var(--tb-blue-pale) !important;
    font-weight: 700; color: var(--tb-blue-dark);
}
.eval-sum-row td { background: var(--tb-gold-pale) !important; font-weight: 600; }
.score-pill {
    display: inline-block; min-width: 34px; text-align: center;
    background: var(--tb-blue); color: #fff; border-radius: 20px;
    padding: 2px 8px; font-weight: 600;
}

/* ---------- progress ---------- */
.progress-bar { background-color: var(--tb-blue); }
.progress-bar.bg-gold { background-color: var(--tb-gold) !important; }

/* ---------- footer ---------- */
.footer-wrap { color: #7d8da6; }