/**
 * ════════════════════════════════════════════════════════════
 * COOP CLEAN — Design Discipline Override v6.5
 * Dev Bandana Cooperative
 * ════════════════════════════════════════════════════════════
 *
 * नियम (Design Principles):
 *  1. No gradients — flat solid colors only
 *  2. No hover-lift (translateY) — subtle bg-change only
 *  3. Soft shadows — max 0 2px 8px rgba(0,0,0,0.07)
 *  4. No decorative animations — functional only
 *  5. Primary color = highlight accent only
 *  6. White + light grey bg — clean & corporate
 *
 * Load order: LAST — after all portal CSS.
 * ════════════════════════════════════════════════════════════
 */

/* ─── SHADOW SCALE (soft, professional) ────────────────────
   Override heavy shadow tokens at :root level               */
:root {
    --shadow-sm  : 0 1px 3px rgba(0,0,0,.06);
    --shadow-md  : 0 2px 8px rgba(0,0,0,.07);
    --shadow-lg  : 0 4px 14px rgba(0,0,0,.08);
    --shadow-primary: 0 2px 8px rgba(var(--primary-rgb, 26,95,42), .12);
    /* Slow down transitions — feels calmer */
    --transition-fast: background .15s, border-color .15s, color .15s;
    --transition-base: background .2s, border-color .2s, color .2s, box-shadow .2s;
}

/* ─── 1. REMOVE ALL HOVER-LIFT TRANSFORMS ─────────────────
   translateY / scale on hover는 디스코텍 느낌 → 제거       */
.card:hover,
.card-coop:hover,
.card-clickable:hover,
.stat-card:hover,
.ds-card:hover,
.ds-tab.active,
.btn-coop:hover,
.btn:hover,
.btn:active,
.btn:focus,
.dash-btn-primary:hover,
.dash-btn-outline-primary:hover,
.dash-btn-outline-warn:hover,
.mem-stat-card:hover,
.mem-quick-link:hover,
.service-card:hover,
.pub-service-card:hover,
.coop-card:hover,
.notice-card:hover,
.team-card:hover,
.gallery-card:hover,
[class*="-card"]:hover {
    transform: none !important;
}

/* Keep sidebar slide transform (functional) */
.sidebar { transform: none; }
@media (max-width: 991.98px) {
    .sidebar { transform: translate3d(-110%, 0, 0) !important; }
    .sidebar.open, .sidebar.sidebar-open { transform: translate3d(0, 0, 0) !important; }
}

/* ─── 2. STRIP ALL GRADIENTS ───────────────────────────────
   Sorted: functional areas → decorative               */

/* ·· 2a. Buttons — flat solid primary ···················· */
.btn-primary,
.dash-btn-primary,
.btn-coop,
.adm-btn-primary {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    box-shadow: none !important;
}
.btn-primary:hover,
.dash-btn-primary:hover,
.btn-coop:hover,
.adm-btn-primary:hover {
    background: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
    box-shadow: none !important;
}
.btn-danger,
.adm-btn-danger {
    background: var(--color-danger, #dc3545) !important;
    border-color: var(--color-danger, #dc3545) !important;
    box-shadow: none !important;
}
.btn-success,
.adm-btn-success {
    background: var(--color-success, #28a745) !important;
    border-color: var(--color-success, #28a745) !important;
    box-shadow: none !important;
}

/* ·· 2b. Modal header — flat, not gradient ··············· */
.modal-header,
.modal-header[class*="gradient"],
.modal-content .modal-header {
    background: var(--primary-color) !important;
    background-image: none !important;
}

/* ·· 2c. Page banner — flat solid, no shimmer ············ */
.page-banner {
    background: var(--primary-color) !important;
    background-image: none !important;
}
.page-banner::before {
    display: none !important;  /* SVG pattern overlay */
}
.page-banner::after {
    display: none !important;  /* Gold shimmer bar */
}
/* Subtle bottom border instead of gold line */
.page-banner {
    border-bottom: 3px solid color-mix(in srgb, var(--primary-color) 60%, white);
}

/* ·· 2d. Sidebar — flat dark, no gradient ················ */
.sidebar,
.admin-sidebar,
nav.sidebar {
    background: #1e2d24 !important;
    background-image: none !important;
}

/* ·· 2e. Dashboard title gradient-text → flat ············ */
.dash-title-main {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: var(--primary-dark, #144a21) !important;
    background-clip: unset !important;
    color: var(--primary-dark, #144a21) !important;
}

/* ·· 2f. Dashboard tab bar — flat ························ */
.ds-tabs {
    background: #f5f5f5 !important;
    background-image: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}
.ds-tab {
    background: transparent !important;
    background-image: none !important;
}
.ds-tab.active {
    background: #ffffff !important;
    background-image: none !important;
    color: var(--primary-color) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
    border-bottom: 2px solid var(--primary-color) !important;
}
/* Remove shimmer ::before pseudo-element on tabs & ds-cards */
.ds-tab::before,
.ds-card::before {
    display: none !important;
}

/* ·· 2g. Dashboard stat cards — flat, no gradient ········ */
.ds-card {
    background: #ffffff !important;
    background-image: none !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.06) !important;
    border: 1px solid #eaecf0 !important;
    transition: box-shadow .2s, border-color .2s !important;
}
.ds-card:hover {
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
    border-color: color-mix(in srgb, var(--primary-color) 30%, #eaecf0) !important;
}
/* Dashboard icon — flat soft bg */
.ds-icon {
    background: color-mix(in srgb, var(--primary-color) 10%, white) !important;
    background-image: none !important;
    color: var(--primary-color) !important;
    box-shadow: none !important;
}
.ds-icon.warn {
    background: #fff8e6 !important;
    color: #a16207 !important;
}
.ds-icon.danger {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}
.ds-icon.info {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
}
.ds-icon.alt,
.ds-icon.dash-icon-purple {
    background: #f5f3ff !important;
    color: #6d28d9 !important;
}

/* ·· 2h. Dashboard buttons — flat ························ */
.dash-btn-primary {
    background: var(--primary-color) !important;
    background-image: none !important;
    border-color: var(--primary-color) !important;
    box-shadow: none !important;
    color: #fff !important;
}
.dash-btn-primary:hover {
    background: var(--primary-dark) !important;
    box-shadow: none !important;
}
.dash-btn-outline-primary:hover,
.dash-btn-outline-warn:hover {
    background: var(--primary-color) !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* ·· 2i. Stat card component — no gradient, soft bg ······ */
.stat-card {
    transition: border-color .2s, box-shadow .2s !important;
}
.stat-card:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
    border-color: color-mix(in srgb, var(--primary-color) 25%, #e5e7eb) !important;
}

/* ·· 2j. Card headers — plain white/grey, no gradient ···· */
.card-header,
.form-card-title,
.svc-form-header-grad,
.appfeat-form-header,
.slb-card-head,
.cred-top-bar,
.hg-card-head {
    background: var(--primary-color) !important;
    background-image: none !important;
}
/* Admin panel card-header already set to light — keep light */
.main-content .card-header,
.admin-shell .card-header,
.admin-page .card-header {
    background: #f8faf9 !important;
    background-image: none !important;
    color: #1f2937 !important;
}

/* ·· 2k. Admin topbar — flat, no gradient ················ */
.admin-topbar,
.admin-header,
.adm-topbar {
    background: var(--primary-dark, #144a21) !important;
    background-image: none !important;
}

/* ·· 2l. KYC/member stat cards gradients — flat ·········· */
.kyc-stat-box,
.kyc-risk-summary,
.mem-stat-icon,
.mem-quick-link .link-icon,
.hg-sidebar-stat,
.arv-stat-box {
    background-image: none !important;
}

/* ·· 2m. Auth pages — plain white card, no gradient ······ */
.auth-card,
.credential-card,
.cred-page-card,
.login-card {
    background: #ffffff !important;
    background-image: none !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.07) !important;
}

/* ·· 2n. Member portal stat cards — flat ················· */
.ds-stats-grid .stat-card,
.mem-stat,
.mem-stat-card {
    background-image: none !important;
}

/* ·· 2o. Various inline gradient backgrounds ············· */
[class*="form-header"],
[class*="-header-grad"],
[class*="header-gradient"],
[class*="-card-head"] {
    background-image: none !important;
}
/* For dark-bg form headers keep solid primary */
.svc-form-header-grad,
.appfeat-form-header,
.slb-card-head {
    background: var(--primary-color) !important;
}

/* ─── 3. SOFTEN ALL SHADOWS ────────────────────────────────
   No heavy depth — clean "paper" elevation               */
.card,
.card-coop,
.stat-card,
.ds-card,
.modal-content,
.dropdown-menu,
.form-card,
[class*="-card"]:not(.badge) {
    box-shadow: 0 1px 4px rgba(0,0,0,.06) !important;
}
.card:hover,
.card-coop:hover,
.stat-card:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}
.modal-content {
    box-shadow: 0 8px 32px rgba(0,0,0,.12) !important;
}
/* Buttons: no shadow */
.btn,
.btn-coop,
[class*="btn-"]:not(.btn-link) {
    box-shadow: none !important;
}
.btn:hover,
.btn:focus,
.btn:active {
    box-shadow: none !important;
}
/* Form focus — subtle ring only */
.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    box-shadow: 0 0 0 2px rgba(var(--primary-rgb, 26,95,42), .10) !important;
    border-color: var(--primary-color) !important;
}

/* ─── 4. REMOVE DECORATIVE ANIMATIONS ─────────────────────
   Alerts, cards, hover shimmer — all removed             */

/* Stop alert slide-in animation */
.alert {
    animation: none !important;
}

/* Stop any pulse/glow/flash on badges */
.badge, .badge-approved, .badge-pending, .badge-rejected, .badge-review {
    animation: none !important;
}

/* Stat card pulse animation removed */
@keyframes statPulse { from {} to {} }
@keyframes fadeSlideIn { from {} to {} }

/* ─── 5. CLEAN BORDERS ─────────────────────────────────────
   1px solid, soft grey — no heavy outlines               */
.card,
.form-card,
.card-coop {
    border: 1px solid var(--border-color, #e5e7eb) !important;
}
.card:hover {
    border-color: color-mix(in srgb, var(--primary-color) 20%, #e5e7eb) !important;
}

/* Table — remove strong colored header, keep subtle */
.table thead th {
    background: #f9fafb !important;
    color: #374151 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: .82rem !important;
    font-weight: 600 !important;
    border-bottom: 2px solid #e5e7eb !important;
}
.table td {
    border-color: #f3f4f6 !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #fafafa !important;
}

/* ─── 6. PAGE BANNER — clean, flat ───────────────────────
   White text on solid primary. No texture, no gold.      */
.page-banner h1 {
    text-shadow: none !important;
    font-weight: 700;
    letter-spacing: -.01em;
}
.page-banner p {
    opacity: .9;
}

/* ─── 7. FORM CONTROLS — clean professional ───────────────
   No icon-gradient bg, flat borders                      */
.input-group-text {
    background: #f9fafb !important;
    border-color: var(--border-color, #e5e7eb) !important;
}
.form-control,
.form-select {
    border-color: #d1d5db !important;
    background: #ffffff !important;
}
.form-control:hover,
.form-select:hover {
    border-color: #9ca3af !important;
}

/* ─── 8. SIDEBAR NAV — clean hover, no gradient ──────────
   Hover = subtle primary-tint bg only                    */
.sidebar-nav a:hover,
.admin-nav a:hover,
.sidebar-menu a:hover,
.admin-sidebar a:hover {
    background: color-mix(in srgb, var(--primary-color) 12%, transparent) !important;
    background-image: none !important;
}
.sidebar-nav a.active,
.admin-nav a.active,
.sidebar-menu a.active {
    background: var(--primary-color) !important;
    background-image: none !important;
    color: #fff !important;
}

/* ─── 9. MEMBER PORTAL CLEAN ──────────────────────────────
   Member bottom nav, stat cards, quick links             */
.mp-bottom-nav,
.mem-bottom-nav {
    background: #ffffff !important;
    background-image: none !important;
    border-top: 1px solid #e5e7eb !important;
    box-shadow: 0 -1px 6px rgba(0,0,0,.06) !important;
}
.mem-topbar,
.member-topbar {
    background: var(--primary-color) !important;
    background-image: none !important;
}

/* ─── 10. ADMIN-MODERN GRADIENT CARD OVERRIDES ────────────
   Specific classes with hardcoded gradients               */
.dash-icon-purple { background: #f5f3ff !important; color: #6d28d9 !important; }

/* Auth login card gradients */
.auth-split-left,
.cred-hero-side {
    background: color-mix(in srgb, var(--primary-color) 8%, white) !important;
    background-image: none !important;
}

/* KYC risk review stat boxes */
.arv-stat-box,
.krv-stat-box {
    background: #f9fafb !important;
    background-image: none !important;
    border: 1px solid #e5e7eb !important;
}

/* Member quick-link icon */
.link-icon,
.appfeat-icon-wrap {
    background: color-mix(in srgb, var(--primary-color) 10%, white) !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* ─── 11. TRANSITION CALM-DOWN ────────────────────────────
   All transitions to max 0.2s, no cubic-bezier dramatics */
*,
*::before,
*::after {
    transition-duration: 0.18s !important;
}
/* Sidebar slide — keep smooth (0.28s) */
.sidebar {
    transition-duration: 0.28s !important;
}
/* Exceptions: never animate font-size or layout properties */
.sidebar-backdrop {
    transition: opacity .2s !important;
}
