/**

 * DEE — Option A: Field & Harvest

 * Linked from all master pages after base theme styles.

 */



/* ── Content area ── */

.content-wrapper {

    background-color: #F5F6F8 !important;

}



.content-wrapper .card {

    border-top: 4px solid #F9A825;

    box-shadow: 0 2px 12px rgba(46, 125, 50, 0.1);

}



.content-wrapper .card-title {

    color: #1B5E20;

}



.content-wrapper .card-description {

    color: #33691E;

}



.content-wrapper .col-form-label,

.content-wrapper .form-label {

    color: #1A2E1A;

    font-weight: 600;

}



/* Dropdowns — never dim grey on any page (select + options) */

.form-select,

select.form-control,

select {

    color: #1A2E1A !important;

    background-color: #fff !important;

}



.form-select option,

select.form-control option,

select option,

.form-select option[value=""],

select.form-control option[value=""],

select option[value=""] {

    color: #1A2E1A !important;

    background-color: #fff !important;

}



/* ── Form panels (Daily Events and similar) ── */

.training-panel,

.collaborator-panel {

    background: #EEF6EE !important;

    border: 1px solid #C8E6C9 !important;

}



/* ── Data grids — soft header (not heavy dark green) ── */

.content-wrapper .table th,

.content-wrapper .table td {

    font-size: 0.875rem;

    white-space: normal;

}



.content-wrapper .table th {

    vertical-align: top !important;

    text-align: left !important;

    background: #E8F5E9 !important;

    color: #1B5E20 !important;

    border-color: #C8E6C9 !important;

    font-weight: 600 !important;

}



.content-wrapper .table tbody tr:nth-child(even) {

    background: #FAFCFA;

}



.content-wrapper .table tbody tr:hover {

    background: #E8F5E9;

}



/* Compact grid rows (Daily Events + Summary) */

.content-wrapper .star-grid td,

.content-wrapper .star-grid th {

    padding-top: 2px;

    padding-bottom: 2px;

    border-color: #C8E6C9 !important;

}



.content-wrapper .star-grid tbody tr:nth-child(even) {

    background: #FAFCFA;

}



.content-wrapper .star-grid tbody tr:hover {

    background: #E8F5E9;

}



/* Grid / action buttons — match green theme */

.content-wrapper .btn-inverse-primary,

.content-wrapper .btn-outline-primary {

    color: #2E7D32;

    border-color: #2E7D32;

    background-color: rgba(46, 125, 50, 0.08);

}



.content-wrapper .btn-inverse-primary:hover,

.content-wrapper .btn-outline-primary:hover {

    color: #fff;

    background-color: #2E7D32;

    border-color: #1B5E20;

}



.content-wrapper .btn-inverse-success,

.content-wrapper .btn-outline-success {

    color: #2E7D32;

    border-color: #2E7D32;

}



.content-wrapper .btn-inverse-success:hover,

.content-wrapper .btn-outline-success:hover {

    color: #fff;

    background-color: #2E7D32;

    border-color: #1B5E20;

}



.content-wrapper .btn-success {

    background-color: #2E7D32;

    border-color: #1B5E20;

}



.content-wrapper .btn-success:hover,

.content-wrapper .btn-success:focus {

    background-color: #1B5E20;

    border-color: #1B5E20;

}



/* Soil / Water / Manure samples table */

.content-wrapper .dee-section-subtitle {

    color: #33691E;

    font-size: 0.9375rem;

    font-weight: 600;

    margin-bottom: 0.75rem;

}



.content-wrapper .sw-sample-grid {

    table-layout: auto;

    width: 100%;

}



.content-wrapper .star-grid.sw-sample-grid th,

.content-wrapper .star-grid.sw-sample-grid td {

    padding: 12px 16px !important;

    line-height: 1.45;

    font-size: 0.9375rem !important;

}



.content-wrapper .sw-sample-grid .sw-details-col {

    width: auto;

    min-width: 220px;

    text-align: left !important;

}



.content-wrapper .sw-sample-grid .sw-num-col,

.content-wrapper .sw-sample-grid .sw-amount-col {

    width: auto;

    min-width: 96px;

    text-align: center !important;

}



.content-wrapper .sw-sample-grid td.sw-details-cell {

    text-align: left !important;

    vertical-align: middle !important;

    font-weight: 600;

    color: #1A2E1A;

    padding-left: 16px !important;

}



.content-wrapper .sw-sample-grid td.sw-num-cell {

    text-align: center !important;

    vertical-align: middle !important;

    color: #1B5E20;

    font-weight: 600;

}



.content-wrapper .sw-sample-grid .sw-sample-input {

    height: 30px;

    padding: 2px 6px;

    font-size: 0.875rem;

    text-align: center;

    border-color: #C8E6C9;

}



.content-wrapper .sw-sample-grid .sw-sample-input:focus {

    border-color: #2E7D32;

    box-shadow: 0 0 0 0.15rem rgba(46, 125, 50, 0.2);

}



/* Event photo gallery */

.content-wrapper .dee-gallery-item {

    background: #FAFCFA;

    border: 1px solid #C8E6C9;

    border-radius: 8px;

    overflow: hidden;

    height: 100%;

    transition: box-shadow 0.2s ease, border-color 0.2s ease;

}



.content-wrapper .dee-gallery-item:hover {

    border-color: #2E7D32;

    box-shadow: 0 4px 12px rgba(46, 125, 50, 0.15);

}



.content-wrapper .dee-gallery-link {

    display: block;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #EEF6EE;

}



.content-wrapper .dee-gallery-img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}



.content-wrapper .dee-gallery-caption {

    padding: 8px 10px;

    font-size: 0.8125rem;

    font-weight: 600;

    color: #1A2E1A;

    line-height: 1.35;

    border-top: 1px solid #C8E6C9;

    background: #fff;

}



.content-wrapper .dee-gallery-empty {

    background: #EEF6EE;

    border: 1px dashed #C8E6C9;

    border-radius: 8px;

    color: #33691E;

}



.content-wrapper .gallery-filters .form-control:disabled {

    background: #EEF6EE;

    color: #1A2E1A;

    cursor: default;

}



/* Employee profile */

.content-wrapper .dee-profile-sidebar {

    background: #FAFCFA;

    border: 1px solid #C8E6C9;

    border-radius: 8px;

    padding: 1.25rem;

    height: 100%;

}



.content-wrapper .dee-profile-photo {

    border: 3px solid #C8E6C9;

    object-fit: cover;

    background: #EEF6EE;

}



.content-wrapper .dee-profile-name {

    color: #1B5E20;

    font-weight: 600;

    font-size: 1.25rem;

}



.content-wrapper .dee-profile-role {

    color: #33691E;

    font-weight: 500;

}



.content-wrapper .dee-contact-panel {

    background: #EEF6EE !important;

    border: 1px solid #C8E6C9 !important;

    border-radius: 8px;

}



.content-wrapper .dee-contact-panel .mdi {

    color: #2E7D32 !important;

}



.content-wrapper .dee-feed-item {

    background: #FAFCFA;

    border: 1px solid #C8E6C9;

    border-radius: 8px;

    padding: 1rem 1.25rem;

    margin-bottom: 1rem;

}



.content-wrapper .dee-feed-title {

    color: #1B5E20;

    font-weight: 600;

    font-size: 1rem;

    margin-bottom: 0;

}



.content-wrapper .dee-feed-meta {

    display: flex;

    flex-wrap: wrap;

    gap: 0.35rem 1.25rem;

    font-size: 0.875rem;

    color: #1A2E1A;

    margin-top: 0.5rem;

}



.content-wrapper .dee-feed-meta span strong {

    color: #33691E;

    font-weight: 600;

}



.content-wrapper .dee-badge-outline {

    display: inline-block;

    color: #2E7D32;

    border: 1px solid #2E7D32;

    background: rgba(46, 125, 50, 0.08);

    font-weight: 500;

    padding: 0.2rem 0.55rem;

    border-radius: 12px;

    font-size: 0.75rem;

    vertical-align: middle;

}



.content-wrapper .dee-feed-photos img {

    width: 180px;

    height: 130px;

    object-fit: cover;

    border-radius: 8px;

    border: 1px solid #C8E6C9;

    margin: 0.5rem 0.5rem 0 0;

}



.content-wrapper .dee-profile-modal .modal-content {

    border: 1px solid #C8E6C9;

    border-top: 4px solid #F9A825;

    border-radius: 8px;

    box-shadow: 0 4px 20px rgba(46, 125, 50, 0.15);

}



.content-wrapper .dee-profile-modal .modal-header {

    background: #EEF6EE;

    border-bottom: 1px solid #C8E6C9;

}



.content-wrapper .dee-profile-modal .modal-title {

    color: #1B5E20;

    font-weight: 600;

}



.content-wrapper .dee-profile-modal .modal-footer {

    background: #FAFCFA;

    border-top: 1px solid #C8E6C9;

}



.content-wrapper .dee-profile-modal .form-label {

    color: #1A2E1A;

    font-weight: 600;

    font-size: 0.875rem;

}



/* ── HAU logo: small white circle behind full PNG (no clipping) ── */

.dee-hau-logo-plate {

    position: relative;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    line-height: 0;

}



.dee-hau-logo-plate::before {

    content: "";

    position: absolute;

    left: 50%;

    top: 50%;

    width: 54px;

    height: 54px;

    margin-left: -27px;

    margin-top: -27px;

    border-radius: 50%;

    background: #fff;

    z-index: 0;

    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);

}



.dee-hau-logo-plate .dee-hau-brand-img,

.dee-hau-logo-plate img {

    position: relative;

    z-index: 1;

    height: 72px !important;

    width: auto !important;

    max-width: none !important;

    object-fit: contain;

    display: block;

    margin: 0 !important;

}



/* ── Sidebar: HAU logo header (matches top navbar) ── */

.dee-sidebar {

    background: #fff;

    border-right: 1px solid #E0E8E0;

}



.dee-sidebar-brand {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 16px 12px 12px;

    border-bottom: 1px solid #E0E8E0;

    background: #fff;

}



.dee-sidebar-brand a {

    display: block;

    line-height: 0;

}



.dee-sidebar-brand .dee-hau-logo-plate {

    margin: 0 auto;

}



.dee-sidebar-brand .dee-hau-brand-img {

    height: 72px !important;

    width: auto !important;

    max-width: none !important;

    object-fit: contain;

}



.dee-sidebar-brand-text {

    margin-top: 8px;

    font-size: 0.6875rem;

    font-weight: 700;

    letter-spacing: 0.06em;

    text-transform: uppercase;

    color: #1B5E20;

    text-align: center;

    line-height: 1.3;

}



.dee-sidebar .nav {

    padding-top: 8px;

}



.dee-sidebar .nav .nav-item .nav-link {

    border-radius: 0 20px 20px 0;

    margin-right: 8px;

}



.dee-sidebar .nav .nav-item .nav-link i {

    color: #2E7D32;

}



/* ── Sidebar active / hover ── */

.sidebar .nav .nav-item.active > .nav-link {

    background: #2E7D32;

    color: #fff;

}



.sidebar .nav .nav-item.active > .nav-link i {

    color: #fff !important;

}



.sidebar .nav .nav-item:not(.active) > .nav-link:hover,

.sidebar .nav .nav-item:not(.active) > .nav-link:hover i {

    color: #2E7D32;

}



/* Collapsed sidebar: keep hover flyout labels visible (active item was white-on-white) */

.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {

    display: flex !important;

    color: #1B5E20 !important;

    background: #fff !important;

    z-index: 999;

}



.sidebar-icon-only .sidebar .nav .nav-item.active.hover-open .nav-link .menu-title {

    color: #1B5E20 !important;

    background: #E8F5E9 !important;

}



.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link:hover .menu-title {

    color: #1B5E20 !important;

    background: #E8F5E9 !important;

}



/* ── Login page ── */

.content-wrapper.auth {

    background: linear-gradient(135deg, #EEF6EE 0%, #F4F7F2 50%, #E8F5E9 100%) !important;

}



.auth-form-light {

    border-top: 4px solid #F9A825;

    box-shadow: 0 4px 20px rgba(46, 125, 50, 0.12);

}



.auth-form-light .btn-primary {

    background-color: #2E7D32;

    border-color: #1B5E20;

}



.auth-form-light .btn-primary:hover,

.auth-form-light .btn-primary:focus {

    background-color: #1B5E20;

    border-color: #1B5E20;

}



.dee-welcome-block {

    padding: 6px 0 6px 14px;

    border-left: 4px solid #F9A825;

    margin: 4px 0;

}



.dee-welcome-greeting {

    display: flex;

    align-items: flex-start;

    gap: 12px;

}



.dee-welcome-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 42px;

    height: 42px;

    border-radius: 12px;

    background: linear-gradient(135deg, #E8F5E9 0%, #C8E6C9 100%);

    color: #2E7D32;

    flex-shrink: 0;

    font-size: 1.35rem;

    box-shadow: 0 2px 8px rgba(46, 125, 50, 0.12);

}



.dee-welcome-lines {

    min-width: 0;

}



.dee-welcome-primary {

    font-family: "Montserrat", sans-serif;

    font-size: 1.25rem;

    line-height: 1.35;

    margin: 0;

}



.dee-welcome-time {

    font-weight: 500;

    color: #558B2F;

}



.dee-welcome-comma {

    color: #558B2F;

    margin-right: 6px;

}



.dee-welcome-user {

    font-weight: 700;

    color: #1B5E20;

}



.dee-welcome-org {

    margin: 4px 0 0;

    font-size: 0.8125rem;

    font-weight: 600;

    color: #666;

    letter-spacing: 0.01em;

}



.with-welcome-text .navbar .navbar-menu-wrapper .navbar-nav .nav-item .dee-welcome-block {

    margin-top: 2px;

}



@media (max-width: 1199px) {

    .dee-welcome-primary {

        font-size: 1.05rem;

    }

}



/* Logo column = sidebar width (220px); same theme color as greeting bar (#F4F5F7) */
.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper {

    display: flex !important;

    width: 220px !important;

    min-width: 220px !important;

    height: auto;

    min-height: 97px;

    padding: 8px 12px !important;

    background: #F4F5F7 !important;

    border-right: none !important;

    flex-shrink: 0;

}



.navbar .navbar-menu-wrapper.dee-navbar-with-brand {

    background: #F4F5F7 !important;

}



.navbar.default-layout {

    background: #F4F5F7 !important;

}



.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 4px;

    width: 100%;

    height: 100%;

    margin: 0;

    text-decoration: none !important;

    cursor: pointer;

}

.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand[data-bs-toggle="minimize"]:hover {
    opacity: 0.92;
}



.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-img,

.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand img {

    height: 48px !important;

    width: auto !important;

    max-width: 100% !important;

    margin: 0 !important;

    object-fit: contain;

    display: block;

}



.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-caption {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 2px;

    width: 100%;

    max-width: 204px;

    font-family: "Manrope", sans-serif;

    text-align: center;

    color: #1A2E1A;

}

.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-line1,
.dee-sidebar-brand-text .dee-hau-brand-line1 {

    display: block;

    width: 100%;

    max-width: 200px;

    font-size: 0.72rem;

    font-weight: 700;

    line-height: 1.15;

    letter-spacing: -0.01em;

    white-space: nowrap;

    text-align: center;

}

.navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-line2,
.dee-sidebar-brand-text .dee-hau-brand-line2 {

    display: block;

    width: 100%;

    max-width: 200px;

    font-size: 0.84rem;

    font-weight: 700;

    line-height: 1.2;

    letter-spacing: 0.02em;

    white-space: nowrap;

    text-align: center;

}

.dee-sidebar-brand-text {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 2px;

    text-transform: none;

    letter-spacing: normal;

}



.sidebar-icon-only .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper {

    width: 70px !important;

    min-width: 70px !important;

    padding: 8px 6px !important;

}

.sidebar-icon-only .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-caption {

    display: none !important;

}



.sidebar-icon-only .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .brand-logo,

.sidebar-icon-only .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .brand-logo-mini {

    display: none !important;

}



.navbar .navbar-menu-wrapper.dee-navbar-with-brand {

    width: calc(100% - 220px) !important;

    flex: 1 1 auto;

}

.sidebar-icon-only .navbar .navbar-menu-wrapper.dee-navbar-with-brand {

    width: calc(100% - 70px) !important;

    flex: 1 1 auto;

}



@media (max-width: 991px) {

    .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper {

        width: 96px !important;

        min-width: 96px !important;

        height: auto;

        padding: 8px 10px !important;

    }



    .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-logo-plate::before {

        width: 42px;

        height: 42px;

        margin-left: -21px;

        margin-top: -21px;

    }



    .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand-img,

    .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper .dee-hau-brand img,

    .dee-hau-logo-plate .dee-hau-brand-img,

    .dee-hau-logo-plate img {

        height: 56px !important;

    }



    .navbar .navbar-menu-wrapper.dee-navbar-with-brand {

        width: calc(100% - 96px) !important;

    }

}



.login-page-shell {

    min-height: 100vh;

    background: #F4F7F2;

}



.login-split-layout {
    display: flex;
    width: 100%;
    height: 100vh;
    min-height: 100vh;
    overflow: hidden;
}


.login-collage-panel {

    flex: 0 0 60%;

    min-width: 0;

    min-height: 100vh;

    padding: 24px 28px;

    background: linear-gradient(160deg, #E8F5E9 0%, #EEF6EE 100%);

    border-right: 1px solid #C8E6C9;

    display: flex;

    flex-direction: column;

    overflow: hidden;

}



.login-collage-header {

    flex: 0 0 auto;

    margin-bottom: 16px;

}



.login-collage-header .login-photo-month-label,

.login-collage-header label {

    display: inline-block;

    background: rgba(255, 255, 255, 0.9);

    border: 1px solid #C8E6C9;

    border-radius: 20px;

    padding: 6px 16px;

    font-size: 0.85rem;

    font-weight: 600;

    color: #1B5E20;

    margin: 0;

}



.login-photo-grid {

    flex: 1 1 auto;

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    grid-template-rows: repeat(3, 1fr);

    gap: 12px;

    min-height: 0;

    height: 100%;

}



.login-panel {

    flex: 0 0 40%;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 40px 48px;

    background: linear-gradient(165deg, #ffffff 0%, #F6FAF6 55%, #EEF6EE 100%);

    overflow: hidden;

}



.login-panel::before,

.login-panel::after {

    content: "";

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

}



.login-panel::before {

    width: 320px;

    height: 320px;

    top: -120px;

    right: -80px;

    background: rgba(46, 125, 50, 0.07);

}



.login-panel::after {

    width: 220px;

    height: 220px;

    bottom: -60px;

    left: -40px;

    background: rgba(249, 168, 37, 0.08);

}



.login-panel-inner {

    position: relative;

    z-index: 1;

    width: 100%;

    max-width: 440px;

}



.login-brand-block {

    text-align: center;

    margin-bottom: 28px;

}



.login-brand-logo {

    width: 72px;

    height: 72px;

    margin-bottom: 12px;

}



.login-brand-title {

    font-family: "Montserrat", sans-serif;

    font-size: 1.15rem;

    font-weight: 700;

    color: #1B5E20;

    line-height: 1.35;

    margin: 0 0 6px;

}



.login-brand-tagline {

    font-size: 0.85rem;

    color: #558B2F;

    margin: 0;

    letter-spacing: 0.02em;

}



.login-form-card {

    width: 100%;

    max-width: none;

    padding: 28px 28px 24px !important;

    border-radius: 14px;

    border: 1px solid #E0E8E0 !important;

    background: #ffffff !important;

    box-shadow: 0 10px 32px rgba(27, 94, 32, 0.1) !important;

}



.login-welcome {

    font-family: "Montserrat", sans-serif;

    font-size: 1.35rem;

    font-weight: 700;

    color: #1B5E20;

    margin: 0 0 6px;

}



.login-subtitle {

    font-size: 0.875rem;

    color: #666;

    margin: 0 0 22px;

    line-height: 1.45;

}



.login-form .login-field {

    margin-bottom: 18px;

}



.login-form .login-field label {

    display: block;

    font-size: 0.8125rem;

    font-weight: 600;

    color: #2E7D32;

    margin-bottom: 6px;

}



.login-input-wrap {

    position: relative;

}



.login-input-icon {

    position: absolute;

    left: 14px;

    top: 50%;

    transform: translateY(-50%);

    font-size: 1.15rem;

    color: #81C784;

    pointer-events: none;

    z-index: 2;

}



.login-input-wrap .login-input {

    padding: 12px 14px 12px 42px;

    height: auto;

    border: 1px solid #C8E6C9;

    border-radius: 10px;

    font-size: 0.9375rem;

    background: #FAFCFA;

    transition: border-color 0.2s ease, box-shadow 0.2s ease;

}



.login-input-wrap .login-input:focus {

    border-color: #2E7D32;

    box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.15);

    background: #fff;

}



.login-actions {

    margin-top: 24px;

}



.login-submit-btn {

    width: 100%;

    padding: 12px 20px;

    font-size: 1rem;

    font-weight: 600;

    letter-spacing: 0.04em;

    border-radius: 10px;

    text-transform: uppercase;

}



.login-message {

    margin-top: 16px;

    padding: 10px 12px;

    border-radius: 8px;

    font-size: 0.875rem;

    line-height: 1.4;

}



.login-message-error {

    background: #FFEBEE;

    border: 1px solid #FFCDD2;

    color: #C62828;

}



.login-footer-note {

    margin: 22px 0 0;

    text-align: center;

    font-size: 0.75rem;

    color: #888;

    line-height: 1.4;

}



.login-no-photos .login-panel {

    flex: 1 1 100%;

}



.login-no-photos .login-panel-inner {

    max-width: 460px;

}



body.dashboard-home .sidebar,
body.sidebar-hidden .sidebar {

    display: none !important;

    width: 0 !important;

    min-width: 0 !important;

    max-width: 0 !important;

    overflow: hidden !important;

    visibility: hidden !important;

    padding: 0 !important;

    margin: 0 !important;

    border: none !important;

}



body.dashboard-home .main-panel,
body.sidebar-hidden .main-panel {

    width: 100% !important;

    max-width: 100% !important;

    flex: 1 1 100% !important;

}



body.dashboard-home .content-wrapper {

    padding-left: 2rem;

}



/* ── Fixed app header (navbar + KVK top nav as one unit) ── */

.dee-app-header {

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    z-index: 1030;

    background: #fff !important;

    border-bottom: 1px solid #E0E8E0;

    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    transform: translateZ(0);

    will-change: transform;

}



.dee-app-header .navbar.default-layout {

    position: relative !important;

    top: auto !important;

    left: auto !important;

    right: auto !important;

    width: 100% !important;

    background: transparent !important;

}



.dee-app-header .navbar .navbar-menu-wrapper,

.dee-app-header .navbar .navbar-menu-wrapper.dee-navbar-with-brand,

.dee-app-header .navbar .navbar-brand-wrapper,

.dee-app-header .navbar .navbar-brand-wrapper.dee-hau-brand-wrapper {

    background: transparent !important;

    border-right: none !important;

}



.dee-app-header .dee-top-nav-bar {

    position: relative;

    top: auto;

    left: auto;

    right: auto;

    z-index: auto;

    background: #fff;

    border-bottom: 1px solid #E0E8E0;

    box-shadow: none;

}



body.with-welcome-text .page-body-wrapper {

    padding-top: var(--dee-header-height, 97px) !important;

}



/* ── KVK top navigation (replaces left sidebar) ── */

.dee-top-nav-bar {

    background: #fff;

}



.dee-top-nav-scroll {

    display: flex;

    flex-wrap: nowrap;

    gap: 4px;

    overflow-x: auto;

    overflow-y: hidden;

    padding: 6px 1rem;

    -webkit-overflow-scrolling: touch;

    overscroll-behavior-x: contain;

    scrollbar-width: thin;

}



.dee-top-nav-link {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    flex: 0 0 auto;

    padding: 8px 14px;

    border-radius: 20px;

    border: 1px solid transparent;

    background: transparent;

    color: #1A2E1A;

    font-size: 0.8125rem;

    font-weight: 500;

    text-decoration: none;

    white-space: nowrap;

    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;

}



.dee-top-nav-link i {

    font-size: 1.1rem;

    color: #2E7D32;

}



.dee-top-nav-link:hover {

    background: #E8F5E9;

    color: #1B5E20;

    text-decoration: none;

}



.dee-top-nav-link.active {

    background: #2E7D32;

    color: #fff;

    border-color: #2E7D32;

}



.dee-top-nav-link.active i {

    color: #fff;

}



body.kvk-top-nav-layout.sidebar-hidden .main-panel,

body.kvk-top-nav-layout.dashboard-home .main-panel {

    width: 100% !important;

    max-width: 100% !important;

    margin-left: 0 !important;

}



/* ── Full-width KVK layout: one background, no gray strip on right ── */

body.kvk-top-nav-layout,

body.kvk-top-nav-layout .container-scroller,

body.kvk-top-nav-layout .page-body-wrapper {

    background: #F5F6F8 !important;

}



body.kvk-top-nav-layout .main-panel {

    width: 100% !important;

    max-width: 100% !important;

    margin-left: 0 !important;

    background: #F5F6F8 !important;

}



/* Fixed header uses padding-top on page-body-wrapper — do not also force
   main-panel to ~100vh or the page grows past the viewport (blank scroll). */

body.kvk-top-nav-layout .page-body-wrapper {

    min-height: 100vh !important;

}



body.kvk-top-nav-layout .main-panel {

    min-height: 0 !important;

}



body.kvk-top-nav-layout .content-wrapper {

    background-color: #F5F6F8 !important;

}



/* jquery-toast: always on top, bottom-right, never clipped */
.jq-toast-wrap {
    z-index: 2147483647 !important;
    width: 320px !important;
    bottom: 24px !important;
    right: 24px !important;
    top: auto !important;
    left: auto !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.jq-toast-single {
    font-size: 13px !important;
    line-height: 1.4 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Shared app footer (Site1 + Action Plan) */

.dee-app-footer,

body.kvk-top-nav-layout .footer,

body.action-plan-layout .footer,

body.apr-layout .footer,

.main-panel > .footer {

    background: #F2F7F2 !important;

    border-top: 1px solid #D5E5D5 !important;

    color: #5A6B5A !important;

    padding: 0 !important;

    font-family: "Manrope", sans-serif !important;

}



.dee-app-footer .dee-app-footer-inner {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between;

    gap: 0.4rem 1.5rem;

    padding: 0.75rem 1.5rem;

    width: 100%;

}



.dee-app-footer .dee-app-footer-copy,

.dee-app-footer .dee-app-footer-credit {

    font-size: 0.8125rem;

    line-height: 1.45;

    color: #5A6B5A;

}



.dee-app-footer .dee-app-footer-credit strong {

    color: #2E7D32;

    font-weight: 600;

}



body.action-plan-layout .dee-app-footer .dee-app-footer-credit strong {

    color: #8F7420;

}



@media (max-width: 767.98px) {

    .dee-app-footer .dee-app-footer-inner {

        flex-direction: column;

        justify-content: center;

        text-align: center;

        padding: 0.85rem 1rem;

    }

}



@media (max-width: 991px) {

    .dee-app-header .navbar .navbar-menu-wrapper {

        min-height: 56px;

        padding-top: 8px !important;

        padding-bottom: 8px !important;

    }



    .dee-top-nav-link {

        padding: 7px 12px;

        font-size: 0.75rem;

    }



    .dee-top-nav-scroll {

        padding: 5px 0.75rem;

    }

}



.login-photo-tile {

    position: relative;

    width: 100%;

    height: 100%;

    min-height: 0;

    border-radius: 12px;

    overflow: hidden;

    box-shadow: 0 6px 18px rgba(27, 94, 32, 0.16);

    border: 2px solid #fff;

    background: #fff;

}



.login-photo-tile img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}



.login-photo-caption {

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    padding: 36px 8px 8px;

    background: linear-gradient(transparent, rgba(0, 0, 0, 0.82));

    color: #fff;

    font-size: 0.75rem;

    line-height: 1.3;

}



.login-photo-title {

    font-weight: 600;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;

}



.login-photo-kvk {

    opacity: 0.92;

    margin-top: 2px;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

}




@media (max-width: 991px) {

    .login-split-layout {

        flex-direction: column;

    }



    .login-collage-panel {

        flex: none;

        min-height: 0;

        height: auto;

        max-height: 52vh;

        border-right: none;

        border-bottom: 1px solid #C8E6C9;

        padding: 16px;

    }



    .login-photo-grid {

        grid-template-columns: repeat(4, 1fr);

        grid-template-rows: repeat(3, 1fr);

        gap: 8px;

    }



    .login-panel {

        flex: 1 1 auto;

        padding: 28px 20px;

    }



    .login-panel-inner {

        max-width: 420px;

    }

}



@media (max-width: 575px) {

    .login-collage-panel {

        max-height: 48vh;

        padding: 12px;

    }



    .login-photo-grid {

        grid-template-columns: repeat(3, 1fr);

        grid-template-rows: repeat(4, 1fr);

        gap: 6px;

    }

}



/* ── Action Plan module color scheme (soft gold vs DEE green) ── */

body.action-plan-layout {

    --ap-accent: #B89B2E;

    --ap-accent-dark: #8F7420;

    --ap-accent-soft: #FAF7F0;

    --ap-accent-border: #E5DCC4;

    --ap-text: #1A2E1A;

    --ap-page-bg: #F6FAF6; /* very light DEE green — fills blank body area */

    background: var(--ap-page-bg) !important;

}



body.action-plan-layout .container-scroller,

body.action-plan-layout .page-body-wrapper,

body.action-plan-layout .main-panel,

body.action-plan-layout .content-wrapper {

    background: var(--ap-page-bg) !important;

}



body.action-plan-layout .dee-app-header .dee-top-nav-bar {

    background: var(--ap-accent-soft);

    border-bottom: 1px solid var(--ap-accent-border);

}



body.action-plan-layout .dee-top-nav-link {

    color: var(--ap-text);

}



body.action-plan-layout .dee-top-nav-link i {

    color: var(--ap-accent-dark);

}



body.action-plan-layout .dee-top-nav-link:hover {

    background: #F0EAD8;

    color: var(--ap-accent-dark);

    text-decoration: none;

}



body.action-plan-layout .dee-top-nav-link.active {

    background: var(--ap-accent);

    border-color: var(--ap-accent);

    color: #fff;

}



body.action-plan-layout .dee-top-nav-link.active i {

    color: #fff;

}



body.action-plan-layout .dee-welcome-org {

    color: var(--ap-accent-dark);

    font-weight: 600;

}



/* Subtle top edge — avoid heavy orange left stripe */

body.action-plan-layout .main-panel .card {

    border-top: 3px solid var(--ap-accent-border);

    border-left: none;

}



body.action-plan-layout .main-panel .card-title {

    color: var(--ap-accent-dark);

}



body.action-plan-layout .main-panel .progress-bar.bg-success,

body.action-plan-layout .main-panel .btn-success {

    background-color: var(--ap-accent) !important;

    border-color: var(--ap-accent-dark) !important;

}



body.action-plan-layout .main-panel .btn-success:hover {

    background-color: var(--ap-accent-dark) !important;

    border-color: var(--ap-accent-dark) !important;

}



/* Keep Bootstrap primary blue for Open/links — do not remap to gold */

body.action-plan-layout .main-panel .bg-primary {

    background-color: var(--ap-accent-soft) !important;

    color: var(--ap-accent-dark) !important;

}



body.action-plan-layout .main-panel .bg-primary.text-white,

body.action-plan-layout .main-panel .bg-primary .text-white {

    color: var(--ap-accent-dark) !important;

}



/* Match Site1 body font (Manrope) across Action Plan */

body.action-plan-layout,

body.action-plan-layout .main-panel,

body.action-plan-layout .content-wrapper,

body.action-plan-layout .card,

body.action-plan-layout .table,

body.action-plan-layout .table th,

body.action-plan-layout .table td,

body.action-plan-layout .form-control,

body.action-plan-layout .form-select,

body.action-plan-layout select,

body.action-plan-layout input,

body.action-plan-layout .btn,

body.action-plan-layout .dee-top-nav-link,

body.action-plan-layout .dee-welcome-block {

    font-family: "Manrope", sans-serif !important;

}



body.action-plan-layout .main-panel .table td,

body.action-plan-layout .main-panel .table th {

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    font-family: "Manrope", sans-serif !important;

}



/* ── Action Plan shared look (Training-inspired, module-wide) ── */

body.action-plan-layout {
    --ap-green: #2E7D32;
    --ap-green-dark: #2E5A2E;
    --ap-green-soft: #E8F5E9;
    --ap-green-row: #F7FBF7;
    --ap-green-hover: #EAF5EA;
    --ap-table-head: #E8F0E0;
    --ap-table-border: #C8DCC8;
}

body.action-plan-layout .dee-top-nav-link.active {
    background: linear-gradient(135deg, #B89B2E, #9A8224) !important;
    border-color: #9A8224 !important;
    box-shadow: 0 2px 8px rgba(184, 155, 46, 0.3);
}

/* Soft cards — skip solid Bootstrap color cards */
body.action-plan-layout .main-panel .card:not([class*="bg-"]):not(.card-tale):not(.card-dark-blue):not(.card-light-danger):not(.card-light-blue) {
    border: none;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(26, 46, 26, 0.06);
    border-top: 3px solid var(--ap-accent);
    background: #fff;
    overflow: hidden;
}

body.action-plan-layout .main-panel .experiment-card .tab-pane .card,
body.action-plan-layout .main-panel .experiment-card .tab-content .card {
    border: none !important;
    border-top: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

body.action-plan-layout .main-panel .form-select,
body.action-plan-layout .main-panel select {
    color: #1A2E1A !important;
    background-color: #fff !important;
}

body.action-plan-layout .main-panel .form-select option,
body.action-plan-layout .main-panel select option {
    color: #1A2E1A !important;
    background-color: #fff !important;
}

body.action-plan-layout .main-panel .card-header {
    background: linear-gradient(90deg, #E8F5E9 0%, #FAF7F0 100%) !important;
    border-bottom: 1px solid #D5E5D5 !important;
    color: var(--ap-text);
}

body.action-plan-layout .main-panel .card-header h3,
body.action-plan-layout .main-panel .card-header h4,
body.action-plan-layout .main-panel .card-header h5,
body.action-plan-layout .main-panel .card-header h6 {
    color: var(--ap-text);
    font-family: "Manrope", sans-serif !important;
}

body.action-plan-layout .main-panel .card-title {
    color: var(--ap-green-dark) !important;
    font-weight: 700;
}

/* Page title / hero strip — Admin MST + Action Plan (flex so icon + title stay one row) */
.ap-page-header,
.training-header,
.fld-page-header {
    border: none !important;
    border-radius: 12px !important;
    overflow: visible;
    background: linear-gradient(105deg, #EEF6EE 0%, #FAF7F0 48%, #FFF9EC 100%) !important;
    border-left: 4px solid var(--ap-green, #2E7D32) !important;
    border-top: none !important;
    box-shadow: 0 2px 10px rgba(46, 125, 50, 0.08) !important;
}

.ap-page-header > .card-body,
.training-header > .card-body,
.fld-page-header > .card-body {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap;
    gap: 0.75rem 1rem;
    padding: 14px 20px !important;
}

.ap-page-header .icon-lg,
.training-header .icon-lg,
.fld-page-header .icon-lg {
    width: 48px;
    height: 48px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--ap-green-soft, #E8F5E9) !important;
    border: 1px solid #C8E6C9;
    border-radius: 50%;
}

.ap-page-header .ap-page-header-main,
.training-header .ap-page-header-main,
.fld-page-header .ap-page-header-main {
    flex: 1 1 auto;
    min-width: 0;
}

.ap-page-header .icon-lg .mdi,
.training-header .icon-lg .mdi,
.fld-page-header .icon-lg .mdi {
    color: var(--ap-green, #2E7D32) !important;
    font-size: 1.5rem;
    line-height: 1;
}

.ap-page-header h3,
.ap-page-header h4,
.training-header h4,
.fld-page-header h3,
.fld-page-header h4 {
    color: var(--ap-text, #1A2E1A) !important;
    font-family: "Manrope", sans-serif !important;
    font-weight: 700 !important;
    margin-bottom: 0 !important;
    font-size: 1.25rem;
}

.ap-page-header small,
.training-header small,
.fld-page-header small {
    color: #5A6B5A !important;
    font-weight: 500;
    display: block;
    margin-top: 0.15rem;
}

.ap-page-header .ap-page-header-aside,
.fld-page-header .ap-page-header-aside {
    margin-left: auto;
    flex-shrink: 0;
}

/* Content cards with gold top accent */
body.action-plan-layout .training-card,
body.action-plan-layout .ap-content-card {
    border-top: 3px solid var(--ap-accent) !important;
}

/* Tables — soft green headers / rows */
body.action-plan-layout .main-panel .table {
    border-color: var(--ap-table-border) !important;
}

body.action-plan-layout .main-panel .table thead th,
body.action-plan-layout .main-panel .table .ap-train-hdr > th,
body.action-plan-layout .main-panel .table tr.ap-train-hdr > th {
    background: linear-gradient(180deg, #F0F7F0 0%, var(--ap-table-head) 100%) !important;
    color: var(--ap-green-dark) !important;
    border-color: var(--ap-table-border) !important;
    font-weight: 600;
    vertical-align: middle;
}

body.action-plan-layout .main-panel .table tbody tr:nth-child(even) > td,
body.action-plan-layout .main-panel .table tbody tr:nth-child(even) {
    background-color: var(--ap-green-row);
}

body.action-plan-layout .main-panel .table-hover > tbody > tr:hover > td,
body.action-plan-layout .main-panel .table tbody tr:hover > td {
    background-color: var(--ap-green-hover) !important;
}

body.action-plan-layout .main-panel .table .form-control,
body.action-plan-layout .main-panel .table .form-select {
    border-color: #D5E0D5;
}

body.action-plan-layout .main-panel .table .form-control:focus,
body.action-plan-layout .main-panel .table .form-select:focus,
body.action-plan-layout .main-panel .form-control:focus,
body.action-plan-layout .main-panel .form-select:focus {
    border-color: var(--ap-accent);
    box-shadow: 0 0 0 0.15rem rgba(184, 155, 46, 0.2);
}

body.action-plan-layout .main-panel .table input[readonly] {
    background: #FFF8DC !important;
    color: var(--ap-accent-dark) !important;
    font-weight: 600;
}

/* Campus / section pills */
body.action-plan-layout .main-panel .nav-pills .nav-link,
body.action-plan-layout .training-campus-pills .nav-link {
    font-weight: 600;
    color: var(--ap-accent-dark);
    background: var(--ap-accent-soft);
    border: 1px solid var(--ap-accent-border);
    border-radius: 8px;
}

body.action-plan-layout .main-panel .nav-pills .nav-link.active,
body.action-plan-layout .training-campus-pills .nav-link.active {
    background: linear-gradient(135deg, #B89B2E, #9A8224) !important;
    border-color: #9A8224 !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(184, 155, 46, 0.35);
}

body.action-plan-layout .main-panel .nav-pills .nav-link:hover:not(.active),
body.action-plan-layout .training-campus-pills .nav-link:hover:not(.active) {
    background: #F0EAD8;
    color: var(--ap-accent-dark);
}

/* Summary metric tiles */
body.action-plan-layout .training-summary-card,
body.action-plan-layout .ap-summary-card {
    border: none;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(26, 46, 26, 0.07);
}

body.action-plan-layout .training-summary-card .card-body,
body.action-plan-layout .ap-summary-card .card-body {
    background: #FCFFFC;
}

body.action-plan-layout .summary-box {
    border-radius: 10px;
    padding: 14px 10px;
    height: 100%;
    border: 1px solid transparent;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

body.action-plan-layout .summary-box:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

body.action-plan-layout .summary-box h4 {
    font-weight: 700;
    font-size: 1.35rem;
}

body.action-plan-layout .summary-box small {
    font-weight: 600;
    color: #5A6B5A;
}

body.action-plan-layout .summary-box--courses { background: #E8F1FF; border-color: #C5D8F5; }
body.action-plan-layout .summary-box--courses h4 { color: #2F5FBF !important; }

body.action-plan-layout .summary-box--others { background: #E6F7F5; border-color: #B8E4DE; }
body.action-plan-layout .summary-box--others h4 { color: #0D8A7C !important; }

body.action-plan-layout .summary-box--scst { background: #FFF3E0; border-color: #F5D6A8; }
body.action-plan-layout .summary-box--scst h4 { color: #C67A12 !important; }

body.action-plan-layout .summary-box--participants { background: #E8F5E9; border-color: #C8E6C9; }
body.action-plan-layout .summary-box--participants h4 { color: #2E7D32 !important; }

body.action-plan-layout .summary-box--cost { background: #FDF0F3; border-color: #F0C8D0; }
body.action-plan-layout .summary-box--cost h4 { color: #C6284A !important; }

/* Progress bar stays gold accent */
body.action-plan-layout .main-panel .progress {
    background: #EEF2EE;
    border-radius: 8px;
    overflow: hidden;
}

body.action-plan-layout .main-panel .btn-outline-primary {
    color: var(--ap-green);
    border-color: var(--ap-green);
}

body.action-plan-layout .main-panel .btn-outline-primary:hover {
    background: var(--ap-green);
    border-color: var(--ap-green);
    color: #fff;
}

/* Shared DEE notify + confirm modals (dee-notify.js) */
#deeNotifyModal .modal-dialog,
#deeConfirmModal .modal-dialog { max-width: 380px; }
#deeNotifyModal .modal-header,
#deeConfirmModal .modal-header { padding: 0.65rem 1rem; }
#deeNotifyModal .modal-body,
#deeConfirmModal .modal-body { padding: 0.85rem 1rem; font-size: 0.95rem; color: #1A2A2E; }
#deeNotifyModal .modal-footer,
#deeConfirmModal .modal-footer { padding: 0.5rem 1rem; }
#deeNotifyModal.dee-notify-ok .modal-header { background: #e8f5e9; border-bottom-color: #c8e6c9; }
#deeNotifyModal.dee-notify-ok .modal-title { color: #1b5e20; }
#deeNotifyModal.dee-notify-err .modal-header { background: #fdecea; border-bottom-color: #f5c2c7; }
#deeNotifyModal.dee-notify-err .modal-title { color: #842029; }
#deeNotifyModal.dee-notify-warn .modal-header,
#deeConfirmModal .modal-header { background: #fff8e1; border-bottom-color: #ffe082; }
#deeNotifyModal.dee-notify-warn .modal-title,
#deeConfirmModal .modal-title { color: #8a6d3b; }
#deeNotifyModal.dee-notify-info .modal-header { background: #e3f2fd; border-bottom-color: #90caf9; }
#deeNotifyModal.dee-notify-info .modal-title { color: #0d47a1; }

/* ── APR module color scheme (cool teal vs Action Plan gold/green) ── */

body.apr-layout {
    --apr-accent: #0E7490;
    --apr-accent-dark: #0F4C5C;
    --apr-accent-soft: #E6F4F7;
    --apr-accent-border: #B7DCE5;
    --apr-text: #12323A;
    --apr-page-bg: #F2F8FA;
    background: var(--apr-page-bg) !important;
}

body.apr-layout .container-scroller,
body.apr-layout .page-body-wrapper,
body.apr-layout .main-panel,
body.apr-layout .content-wrapper {
    background: var(--apr-page-bg) !important;
}

body.apr-layout .dee-app-header .dee-top-nav-bar {
    background: var(--apr-accent-soft);
    border-bottom: 1px solid var(--apr-accent-border);
}

body.apr-layout .dee-top-nav-link {
    color: var(--apr-text);
}

body.apr-layout .dee-top-nav-link i {
    color: var(--apr-accent-dark);
}

body.apr-layout .dee-top-nav-link:hover {
    background: #D7EEF3;
    color: var(--apr-accent-dark);
    text-decoration: none;
}

body.apr-layout .dee-top-nav-link.active {
    background: linear-gradient(135deg, #0E7490, #0F5F73) !important;
    border-color: #0F5F73 !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(14, 116, 144, 0.28);
}

body.apr-layout .dee-top-nav-link.active i {
    color: #fff !important;
}

body.apr-layout .dee-welcome-org {
    color: var(--apr-accent-dark);
    font-weight: 600;
}

body.apr-layout .dee-welcome-icon {
    background: var(--apr-accent-soft);
    color: var(--apr-accent-dark);
}

body.apr-layout .dee-app-footer .dee-app-footer-credit strong {
    color: var(--apr-accent-dark);
}

body.apr-layout,
body.apr-layout .main-panel,
body.apr-layout .content-wrapper,
body.apr-layout .card,
body.apr-layout .table,
body.apr-layout .table th,
body.apr-layout .table td,
body.apr-layout .form-control,
body.apr-layout .form-select,
body.apr-layout select,
body.apr-layout input,
body.apr-layout .btn,
body.apr-layout .dee-top-nav-link,
body.apr-layout .dee-welcome-block {
    font-family: "Manrope", sans-serif !important;
}

body.apr-layout .main-panel .card:not([class*="bg-"]):not(.card-tale):not(.card-dark-blue):not(.card-light-danger):not(.card-light-blue) {
    border: none;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(15, 76, 92, 0.07);
    border-top: 3px solid var(--apr-accent);
    background: #fff;
    overflow: hidden;
}

body.apr-layout .main-panel .card-title {
    color: var(--apr-accent-dark) !important;
    font-weight: 700;
}

body.apr-layout .main-panel .btn-success,
body.apr-layout .main-panel .btn-gradient-primary,
body.apr-layout .main-panel .btn-primary {
    background-color: var(--apr-accent) !important;
    border-color: var(--apr-accent-dark) !important;
    color: #fff !important;
}

body.apr-layout .main-panel .btn-success:hover,
body.apr-layout .main-panel .btn-gradient-primary:hover,
body.apr-layout .main-panel .btn-primary:hover {
    background-color: var(--apr-accent-dark) !important;
    border-color: var(--apr-accent-dark) !important;
}

body.apr-layout .main-panel .btn-gradient-info,
body.apr-layout .main-panel .btn-info {
    background-color: #148BA8 !important;
    border-color: #0E7490 !important;
    color: #fff !important;
}

body.apr-layout .main-panel .btn-gradient-success {
    background-color: #0F5F73 !important;
    border-color: #0F4C5C !important;
    color: #fff !important;
}

body.apr-layout .main-panel .form-select,
body.apr-layout .main-panel select,
body.apr-layout .main-panel .form-control {
    color: var(--apr-text) !important;
    background-color: #fff !important;
}

body.apr-layout .main-panel .form-select option,
body.apr-layout .main-panel select option {
    color: var(--apr-text) !important;
    background-color: #fff !important;
}

body.apr-layout .main-panel .table thead th {
    background: #DCEEF3;
    color: var(--apr-accent-dark);
    border-color: var(--apr-accent-border);
}

body.apr-layout .main-panel .table td,
body.apr-layout .main-panel .table th {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}