/* =====================================================================
   SMS Achievers — Admin (Executive panel) gold theme
   Remaps AdminLTE "primary" (default blue) to the logo gold/bronze.
   Place at: Executive-panel/css/sms-admin-theme.css
   Link AFTER skin_color.css on both the login page and MasterPage.
   ===================================================================== */

:root {
    --sms-gold: #b5822a;
    --sms-gold-dark: #9c6e1f;
}

/* ---------- BUTTONS ---------- */
.btn-primary {
    background-color: var(--sms-gold) !important;
    border-color: var(--sms-gold) !important;
    color: #fff !important;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-primary.active,
    .btn-primary:not(:disabled):not(.disabled):active,
    .btn-primary:not(:disabled):not(.disabled).active {
        background-color: var(--sms-gold-dark) !important;
        border-color: var(--sms-gold-dark) !important;
        color: #fff !important;
    }

.btn-outline.btn-primary,
.btn-outline-primary {
    color: var(--sms-gold) !important;
    border-color: var(--sms-gold) !important;
    background-color: transparent !important;
}

    .btn-outline.btn-primary:hover,
    .btn-outline-primary:hover {
        background-color: var(--sms-gold) !important;
        color: #fff !important;
    }

/* ---------- TEXT / BG / BORDER UTILITIES ---------- */
.text-primary {
    color: var(--sms-gold) !important;
}

a.text-primary:hover, a.text-primary:focus {
    color: var(--sms-gold-dark) !important;
}

.bg-primary {
    background-color: var(--sms-gold) !important;
    color: #fff !important;
}

.border-primary, .b-primary {
    border-color: var(--sms-gold) !important;
}

    /* ---------- ICON BORDERS (dashboard widgets) ---------- */
    .border-primary.b-1 {
        border-color: var(--sms-gold) !important;
    }

/* ---------- RIBBONS (dashboard) ---------- */
.ribbon-two-primary span {
    background-color: var(--sms-gold);
}

    .ribbon-two-primary span:before {
        border-right-color: var(--sms-gold-dark);
    }

    .ribbon-two-primary span:after {
        border-left-color: var(--sms-gold-dark);
    }

/* ---------- LINKS / MISC ACCENTS ---------- */
a.register-btn {
    color: var(--sms-gold) !important;
}

    a.register-btn:hover {
        color: var(--sms-gold-dark) !important;
    }

.fog-pwd a:hover {
    color: var(--sms-gold) !important;
}

/* ---------- SIDEBAR ACTIVE STATE (theme-primary skin) ---------- */
.sidebar-menu > li.active > a,
.sidebar-menu > li:hover > a,
.sidebar-menu > li.menu-open > a {
    color: var(--sms-gold) !important;
}

.sidebar-menu > li.active > a {
    border-left-color: var(--sms-gold) !important;
}

.sidebar-menu .treeview-menu > li.active > a,
.sidebar-menu .treeview-menu > li > a:hover {
    color: var(--sms-gold) !important;
}

/* ---------- FORM FOCUS ---------- */
.form-control:focus {
    border-color: var(--sms-gold) !important;
}

/* ---------- LOGIN PAGE LOGO SIZING ---------- */
.content-top-agile img {
    max-height: 80px;
    width: auto;
}

/* =====================================================================
/* =====================================================================
   SWEETALERT2 popups — premium gold theme
   ===================================================================== */

/* Glassy dimmed backdrop */
.swal2-container.swal2-backdrop-show,
.swal2-backdrop-show {
    background: rgba(20,18,15,.55) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Card */
.swal2-popup {
    border-radius: 22px;
    padding: 0 0 30px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(31,26,23,.28);
    animation: smsPop .35s cubic-bezier(.18,.89,.32,1.28);
}

@keyframes smsPop {
    0% {
        transform: scale(.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Gold accent bar across the top */
.swal2-popup:before {
    content: "";
    display: block;
    height: 6px;
    width: 100%;
    background: linear-gradient(90deg,#e0a82e 0%,#b5822a 50%,#9c6e1f 100%);
}

.swal2-title {
    color: #1f1a17;
    font-size: 23px;
    font-weight: 800;
    letter-spacing: .2px;
    margin-top: 26px;
}

.swal2-html-container,
.swal2-content {
    color: #5a5650;
    font-size: 15.5px;
    line-height: 1.65;
    padding: 0 28px;
}

/* Confirm / OK -> glossy gold pill */
.swal2-styled.swal2-confirm {
    background: linear-gradient(135deg,#c8941f 0%,#b5822a 55%,#9c6e1f 100%) !important;
    border: none !important;
    border-radius: 40px !important;
    padding: 12px 40px !important;
    font-weight: 700 !important;
    letter-spacing: .4px !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(181,130,42,.42) !important;
    transition: transform .2s ease,box-shadow .2s ease,filter .2s ease !important;
}

    .swal2-styled.swal2-confirm:hover {
        transform: translateY(-2px);
        filter: brightness(1.05);
        box-shadow: 0 14px 28px rgba(156,110,31,.5) !important;
    }

    .swal2-styled.swal2-confirm:active {
        transform: translateY(0);
    }

.swal2-styled:focus {
    box-shadow: 0 10px 22px rgba(181,130,42,.42) !important;
    outline: none !important;
}

/* Cancel -> dark brown pill */
.swal2-styled.swal2-cancel {
    background: #1f1a17 !important;
    border-radius: 40px !important;
    padding: 12px 34px !important;
    font-weight: 700 !important;
    letter-spacing: .4px !important;
}

/* Success icon -> green check (logo swoosh) on soft gold ring */
.swal2-icon {
    margin-top: 32px;
}

    .swal2-icon.swal2-success [class^='swal2-success-line'] {
        background-color: #3b7f48 !important;
    }

    .swal2-icon.swal2-success .swal2-success-ring {
        border-color: rgba(181,130,42,.30) !important;
    }

    .swal2-icon.swal2-success {
        border-color: rgba(59,127,72,.25) !important;
        box-shadow: 0 0 0 8px rgba(181,130,42,.06);
    }

    /* Error / warning icons tinted to brand-neutral */
    .swal2-icon.swal2-error {
        border-color: rgba(229,57,53,.3) !important;
    }

/* =====================================================================
   DASHBOARD WIDGET CARDS — recolored to the logo palette
   Scoped to .box .icon and .widget-h6 so global status colours
   (e.g. red validation text) are left untouched.
   gold #b5822a | amber-gold #cf9b3a | logo green #3b7f48 | bronze #8a5a2b
   ===================================================================== */

/* --- icon ring borders --- */
.box .icon.border-primary {
    border-color: #b5822a !important;
}

.box .icon.border-warning {
    border-color: #cf9b3a !important;
}

.box .icon.border-info {
    border-color: #3b7f48 !important;
}

.box .icon.border-danger {
    border-color: #8a5a2b !important;
}

/* --- icon glyph colours --- */
.box .icon i.text-primary {
    color: #b5822a !important;
}

.box .icon i.text-warning {
    color: #cf9b3a !important;
}

.box .icon i.text-info {
    color: #3b7f48 !important;
}

.box .icon i.text-danger {
    color: #8a5a2b !important;
}

/* --- widget value numbers --- */
.widget-h6.text-primary {
    color: #b5822a !important;
}

.widget-h6.text-warning {
    color: #cf9b3a !important;
}

.widget-h6.text-info {
    color: #3b7f48 !important;
}

.widget-h6.text-danger {
    color: #8a5a2b !important;
}

/* --- dashboard ribbons --- */
.ribbon-two-primary span {
    background-color: #b5822a;
}

.ribbon-two-info span {
    background-color: #3b7f48;
}

    .ribbon-two-info span:before {
        border-right-color: #2f6539;
    }

    .ribbon-two-info span:after {
        border-left-color: #2f6539;
    }

/* =====================================================================
   COMPACT SCALING — smaller sidebar logo + tighter dashboard widgets
   ===================================================================== */

/* Sidebar logo */
.user-profile .ulogo {
    padding: 8px 0;
}

    .user-profile .ulogo img {
        max-height: 66px;
        width: auto;
    }

/* Dashboard widget icon circles */
.box-body .icon.w-60.h-60 {
    width: 48px !important;
    height: 48px !important;
}

.box-body .icon i {
    font-size: 20px !important;
}

/* Widget labels + values */
.widget-text {
    font-size: 13px !important;
    margin-top: 6px !important;
    margin-bottom: 2px !important;
}

.widget-h6 {
    font-size: 16px !important;
}

/* Tighter card padding */
.box-body {
    padding: 16px !important;
}

/* Mobile / Email ribbon rows — scale the big text down */
.ribbon-box .dash-para {
    font-size: 20px !important;
}
