/* ==========================================================================
   DANMAMA Natural Nurture Ltd. — brand theme overrides
   Loaded AFTER style.css so these rules win without needing !important
   everywhere. Colors pulled from the DANMAMA logo (deep forest green ring +
   warm gold wheat accents).
   ========================================================================== */
:root {
    --dm-green-dark: #12331f;
    --dm-green: #1c4d2b;
    --dm-green-mid: #256b3a;
    --dm-green-light: #e7f1ea;
    --dm-gold: #c9971f;
    --dm-gold-light: #f7ecd2;
    --dm-text: #1e2b22;
}

/* ---- Sidebar / header brand colors ---- */
.sidebar-color {
    background-color: var(--dm-green-dark) !important;
}
.sidebar-menu-one .sidebar-menu-content .nav-sidebar-menu > .nav-item > .nav-link.menu-active,
.sidebar-menu-one .sidebar-menu-content .nav-sidebar-menu > .nav-item .sub-group-menu > .nav-item .nav-link.menu-active,
.sidebar-menu-one .sidebar-menu-content .nav-sidebar-menu > .nav-item .sub-group-menu > .nav-item .nav-link:hover {
    color: var(--dm-gold) !important;
}
.header-menu-one { border-bottom: 3px solid var(--dm-green); }
.header-logo img { max-height: 44px; width: auto; }

a, .item-title a { }
.dashboard-page-one a:not(.btn):not(.fw-btn-fill):not(.btn-fill-lg):not(.btn-fill-md):not(.btn-fill-sm) {
    color: var(--dm-green-mid);
}

/* ---- btn-light: on white cards, the stock Bootstrap btn-light (near-white
   bg + near-white border) becomes invisible. Give it real contrast. ---- */
.btn-light,
a.btn-light {
    color: var(--dm-text) !important;
    background-color: #eef2ef !important;
    border-color: #c7d2cb !important;
}
.btn-light:hover,
.btn-light:focus,
a.btn-light:hover {
    color: var(--dm-text) !important;
    background-color: #dfe7e1 !important;
    border-color: #b3c1b8 !important;
}

/* ==========================================================================
   Robust checkbox (Instructions "I agree" checkbox, and any other plain
   checkbox in the app). The theme's original .form-check CSS only styled
   input[type="checkbox"], relied on font-icon pseudo content that can fail
   to render, and used the same rules for radios too (causing the exam
   question layout bug). This block replaces that with a self-contained,
   dependency-free style that always shows a visible tick.
   ========================================================================== */
.dm-check {
    position: relative;
    display: block;
    padding-left: 32px;
    min-height: 24px;
    cursor: pointer;
    font-size: 15px;
    color: var(--dm-text);
    margin-bottom: 0;
}
.dm-check input[type="checkbox"] {
    position: absolute;
    left: 0;
    top: 2px;
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    accent-color: var(--dm-green);
    /* keep the native control visible & full-size instead of hiding it
       behind a pseudo-element that may never paint */
    opacity: 1;
    z-index: 2;
}
.dm-check label {
    cursor: pointer;
    font-size: 15px;
    color: var(--dm-text);
    margin-bottom: 0;
}

/* ==========================================================================
   Exam question options (MCQ / True-False). Self-contained so it can never
   collide with the theme's checkbox-only .form-check rules (that collision
   was the cause of the overlapping / strike-through option text on the
   exam page).
   ========================================================================== */
.exam-option {
    position: relative;
    display: block;
    padding: 10px 14px 10px 40px;
    margin-bottom: 8px;
    border: 1px solid #e0e6e2;
    border-radius: 6px;
    background: #fff;
    transition: border-color .15s ease, background-color .15s ease;
}
.exam-option:hover { border-color: var(--dm-green-mid); }
.exam-option input[type="radio"] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--dm-green);
    z-index: 2;
}
.exam-option label {
    display: block;
    margin: 0;
    padding-left: 4px;
    font-size: 15px;
    color: var(--dm-text);
    cursor: pointer;
}
.exam-option.is-checked {
    border-color: var(--dm-green);
    background: var(--dm-green-light);
}

/* ==========================================================================
   Lightweight modal helpers used across Questions / Applicants / Exam
   Settings / Grade Essays admin pages.
   ========================================================================== */
.dm-modal-header {
    background: var(--dm-green-dark);
    color: #fff;
    border-bottom: 0;
}
.dm-modal-header .close { color: #fff; opacity: .85; text-shadow: none; }
.dm-modal-header .modal-title { color: #fff; }
.modal-footer { background: #fafbfa; }

/* status badges (active/inactive applicants, question active flag, etc.) */
.dm-badge {
    display: inline-block;
    padding: .3em .65em;
    font-size: 12px;
    font-weight: 600;
    border-radius: 20px;
}
.dm-badge-active { background: #e3f3e8; color: #1c6b34; }
.dm-badge-inactive { background: #f5e3e3; color: #a3282f; }

/* table-responsive tables should never force ugly horizontal scroll on
   normal desktop widths when they don't need to */
.table-responsive { width: 100%; }