/* ============================================================
   Jivan Darpan – Public Styles
   login-form + member-dashboard + registration-form
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600;700;800&family=Noto+Sans+Devanagari:wght@400;500;600;700&display=swap');

/* ── CSS Variables ──────────────────────────────────── */
:root {
    --jd-gold:        #c8951a !important;
    --jd-gold-light:  #f0b429 !important;
    --jd-gold-pale:   #fdf3d8 !important;
    --jd-green-deep:  #1a4731 !important;
    --jd-green-mid:   #2d6a4f !important;
    --jd-green-light: #52b788 !important;
    --jd-green-pale:  #edf7f1 !important;
    --jd-cream:       #fdf9f2 !important;
    --jd-cream-d:     #f4ead6 !important;
    --jd-border:      #e8dfc8 !important;
    --jd-text:        #1c1208 !important;
    --jd-text-mid:    #3a3020 !important;
    --jd-text-muted:  #7a6a4a !important;
    --jd-white:       #ffffff !important;
    --jd-danger:      #c0392b !important;
    --jd-danger-pale: #fff0ef !important;
    --jd-info-pale:   #e8f4fd !important;
    --jd-info:        #1565c0 !important;
    --jd-shadow:      0 4px 20px rgba(26,71,49,.1) !important;
}

/* ── Base font reset ────────────────────────────────── */
#jmd-wrap,
#jm-login-page-wrap,
#jm-registration-wrap {
    font-family: 'Noto Sans Devanagari', 'Baloo 2', Arial, sans-serif !important;
    color: #1c1208 !important;
}

/* ════════════════════════════════════════════════════
   LOGIN FORM
════════════════════════════════════════════════════ */

#jm-login-page-wrap {
    max-width: 960px !important;
    margin: 30px auto !important;
}

.jml-card {
    display: flex !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 60px rgba(26,71,49,.18), 0 4px 16px rgba(0,0,0,.1) !important;
    min-height: 540px !important;
}

/* ── Left panel ── */
.jml-left {
    flex: 1.1 !important;
    background: linear-gradient(160deg, #1a4731 0%, #0d2b1e 60%, #081a11 100%) !important;
    padding: 44px 40px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
    overflow: hidden !important;
}
.jml-left::before {
    content: '' !important;
    position: absolute !important;
    top: -70px !important; right: -70px !important;
    width: 260px !important; height: 260px !important;
    border: 1px solid rgba(200,149,26,.2) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}
.jml-left::after {
    content: '🌾' !important;
    position: absolute !important;
    bottom: 20px !important; right: 24px !important;
    font-size: 90px !important;
    opacity: .05 !important;
    pointer-events: none !important;
}

.jml-brand { position: relative !important; z-index: 1 !important; }
.jml-logo {
    width: 64px !important; height: 64px !important;
    background: linear-gradient(135deg, #c8951a 0%, #f0b429 100%) !important;
    border-radius: 16px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 32px !important;
    margin-bottom: 18px !important;
    box-shadow: 0 8px 24px rgba(200,149,26,.35) !important;
}
.jml-brand-name {
    font-family: 'Baloo 2', sans-serif !important;
    font-size: 26px !important; font-weight: 800 !important;
    color: #fff !important; line-height: 1.1 !important;
    margin-bottom: 5px !important;
}
.jml-brand-name span { color: #f0b429 !important; }
.jml-brand-sub { font-size: 12px !important; color: rgba(255,255,255,.5) !important; letter-spacing: .5px !important; }

.jml-features {
    display: flex !important; flex-direction: column !important;
    gap: 18px !important;
    position: relative !important; z-index: 1 !important;
}
.jml-feat {
    display: flex !important; align-items: center !important; gap: 12px !important;
}
.jml-feat-icon {
    width: 40px !important; height: 40px !important;
    background: rgba(200,149,26,.12) !important;
    border: 1px solid rgba(200,149,26,.25) !important;
    border-radius: 10px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 18px !important; flex-shrink: 0 !important;
}
.jml-feat-text strong { display: block !important; font-size: 13px !important; color: rgba(255,255,255,.9) !important; font-weight: 600 !important; margin-bottom: 1px !important; }
.jml-feat-text p { margin: 0 !important; font-size: 11.5px !important; color: rgba(255,255,255,.45) !important; }

.jml-copy { font-size: 11px !important; color: rgba(255,255,255,.3) !important; position: relative !important; z-index: 1 !important; }

/* ── Right panel ── */
.jml-right {
    flex: 1 !important;
    background: #fdf9f2 !important;
    display: flex !important; align-items: center !important;
}
.jml-right-inner {
    padding: 44px 40px !important;
    width: 100% !important;
}
.jml-header { margin-bottom: 28px !important; }
.jml-greeting {
    display: block !important;
    font-size: 12px !important; font-weight: 700 !important;
    color: #2d6a4f !important; letter-spacing: 1px !important;
    text-transform: uppercase !important; margin-bottom: 6px !important;
}
.jml-header h2 {
    font-family: 'Baloo 2', sans-serif !important;
    font-size: 28px !important; font-weight: 800 !important;
    color: #1c1208 !important; line-height: 1.15 !important;
    margin: 0 0 6px !important;
}
.jml-header p { font-size: 13px !important; color: #7a6a4a !important; margin: 0 !important; }

.jml-field { margin-bottom: 18px !important; }
.jml-field label {
    display: block !important; font-size: 13px !important;
    font-weight: 600 !important; color: #3a3020 !important;
    margin-bottom: 7px !important; letter-spacing: .3px !important;
}
.jml-input-wrap { position: relative !important; }
.jml-input-icon {
    position: absolute !important; left: 13px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 16px !important; pointer-events: none !important;
    color: #7a6a4a !important;
}
.jml-input-wrap input {
    width: 100% !important;
    padding: 12px 14px 12px 42px !important;
    border: 1.5px solid #ddd2b8 !important;
    border-radius: 10px !important;
    font-size: 14px !important; font-family: inherit !important;
    background: #fff !important; color: #1c1208 !important;
    transition: border-color .2s, box-shadow .2s !important;
    outline: none !important; box-sizing: border-box !important;
}
.jml-input-wrap input:focus {
    border-color: #c8951a !important;
    box-shadow: 0 0 0 3px rgba(200,149,26,.14) !important;
}
.jml-toggle-pass {
    position: absolute !important; right: 11px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important; border: none !important;
    cursor: pointer !important; font-size: 16px !important;
    color: #7a6a4a !important; padding: 4px !important;
}
.jml-toggle-pass:hover { color: #c8951a !important; }

.jml-remember-row {
    display: flex !important; align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 22px !important; font-size: 13px !important;
}
.jml-remember-label {
    display: flex !important; align-items: center !important;
    gap: 7px !important; color: #7a6a4a !important; cursor: pointer !important;
}
.jml-remember-label input[type="checkbox"] {
    width: 15px !important; height: 15px !important;
    accent-color: #c8951a !important; cursor: pointer !important;
}
.jml-forgot { color: #2d6a4f !important; font-weight: 600 !important; text-decoration: none !important; font-size: 13px !important; }
.jml-forgot:hover { color: #c8951a !important; }

.jml-btn-submit {
    width: 100% !important;
    padding: 14px !important;
    background: linear-gradient(135deg, #2d6a4f 0%, #1a4731 100%) !important;
    color: #fff !important; border: none !important;
    border-radius: 10px !important; font-size: 15px !important;
    font-weight: 700 !important; font-family: inherit !important;
    cursor: pointer !important; letter-spacing: .3px !important;
    transition: opacity .2s, transform .18s !important;
    box-shadow: 0 6px 20px rgba(26,71,49,.3) !important;
}
.jml-btn-submit:hover { opacity: .9 !important; transform: translateY(-2px) !important; }

.jml-alert {
    padding: 12px 16px !important; border-radius: 8px !important;
    font-size: 13.5px !important; margin-bottom: 18px !important; font-weight: 500 !important;
}
.jml-alert-error  { background: #fff0ef !important; color: #7a1a14 !important; border-left: 3px solid #c0392b !important; }
.jml-alert-success { background: #edf7f1 !important; color: #1a4731 !important; border-left: 3px solid #2d6a4f !important; }

/* ════════════════════════════════════════════════════
   MEMBER DASHBOARD
════════════════════════════════════════════════════ */

#jmd-wrap {
    max-width: 100% !important;
    margin: 0 !important;
    background: #f0ece1 !important;
    min-height: 100vh !important;
}

/* ── Topbar ── */
.jmd-topbar {
    background: linear-gradient(135deg, #1a4731 0%, #0d2b1e 100%) !important;
    height: 60px !important;
    display: flex !important; align-items: center !important;
    justify-content: space-between !important;
    padding: 0 24px !important;
    position: sticky !important; top: 0 !important; z-index: 200 !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.2) !important;
}
.jmd-topbar-brand { display: flex !important; align-items: center !important; gap: 10px !important; }
.jmd-topbar-logo {
    width: 36px !important; height: 36px !important;
    background: linear-gradient(135deg, #c8951a 0%, #f0b429 100%) !important;
    border-radius: 9px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 18px !important;
}
.jmd-brand-name {
    font-family: 'Baloo 2', sans-serif !important;
    font-size: 17px !important; font-weight: 800 !important; color: #fff !important; line-height: 1 !important;
}
.jmd-brand-name span { color: #f0b429 !important; }
.jmd-brand-sub { font-size: 10.5px !important; color: rgba(255,255,255,.5) !important; letter-spacing: .5px !important; }

.jmd-topbar-right { display: flex !important; align-items: center !important; gap: 12px !important; }
.jmd-topbar-user { display: flex !important; align-items: center !important; gap: 8px !important; }
.jmd-user-avatar {
    width: 34px !important; height: 34px !important; border-radius: 50% !important;
    background: linear-gradient(135deg, #c8951a 0%, #e8a820 100%) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 13px !important; font-weight: 700 !important; color: #fff !important;
    flex-shrink: 0 !important;
}
.jmd-user-name { font-size: 13px !important; font-weight: 600 !important; color: #fff !important; line-height: 1.2 !important; }
.jmd-user-role { font-size: 11px !important; color: rgba(255,255,255,.5) !important; }
.jmd-logout-btn {
    background: rgba(255,255,255,.1) !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    color: rgba(255,255,255,.8) !important;
    padding: 6px 14px !important; border-radius: 7px !important;
    font-size: 12.5px !important; font-family: inherit !important;
    cursor: pointer !important; transition: all .2s !important;
    text-decoration: none !important; display: inline-flex !important; align-items: center !important;
}
.jmd-logout-btn:hover { background: rgba(255,255,255,.18) !important; color: #fff !important; }

/* ── Layout ── */
.jmd-layout {
    display: flex !important;
    min-height: calc(100vh - 60px) !important;
}

/* ── Sidebar ── */
.jmd-sidebar {
    width: 240px !important; flex-shrink: 0 !important;
    background: #fff !important;
    border-right: 1px solid #e8dfc8 !important;
    padding: 20px 12px !important;
    position: sticky !important; top: 60px !important;
    height: calc(100vh - 60px) !important;
    overflow-y: auto !important;
}
.jmd-sidebar-label {
    display: block !important; font-size: 10px !important; font-weight: 700 !important;
    color: #7a6a4a !important; letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    padding: 0 10px !important; margin: 14px 0 5px !important;
}
.jmd-sidebar-label:first-child { margin-top: 0 !important; }
.jmd-sidebar-item {
    display: flex !important; align-items: center !important; gap: 9px !important;
    padding: 9px 12px !important; border-radius: 9px !important;
    cursor: pointer !important; font-size: 13.5px !important;
    color: #3a3020 !important; font-weight: 500 !important;
    transition: all .18s !important;
    background: none !important; border: none !important; width: 100% !important;
    text-align: left !important; font-family: inherit !important;
    margin-bottom: 2px !important;
}
.jmd-sidebar-item:hover { background: #fdf3d8 !important; color: #c8951a !important; }
.jmd-sidebar-item.active { background: #edf7f1 !important; color: #1a4731 !important; font-weight: 600 !important; }
.jmd-sidebar-badge {
    margin-left: auto !important;
    background: #fdf3d8 !important; color: #c8951a !important;
    font-size: 11px !important; font-weight: 700 !important;
    padding: 2px 7px !important; border-radius: 20px !important;
}
.jmd-sidebar-item.active .jmd-sidebar-badge { background: #edf7f1 !important; color: #1a4731 !important; }

/* ── Main content ── */
.jmd-main {
    flex: 1 !important;
    padding: 24px 28px !important;
    overflow: hidden !important;
}

.jmd-section { display: none !important; }
.jmd-section.active { display: block !important; }

/* ── Hero card ── */
.jmd-hero-card {
    background: linear-gradient(135deg, #1a4731 0%, #0f3220 60%, #081a10 100%) !important;
    border-radius: 16px !important;
    padding: 24px 28px !important;
    display: flex !important; align-items: center !important; gap: 18px !important;
    margin-bottom: 20px !important;
    position: relative !important; overflow: hidden !important;
}
.jmd-hero-card::after {
    content: '🌾' !important;
    position: absolute !important; right: 28px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 80px !important; opacity: .07 !important; pointer-events: none !important;
}
.jmd-hero-avatar {
    width: 64px !important; height: 64px !important; border-radius: 50% !important;
    background: linear-gradient(135deg, #c8951a 0%, #f0b429 100%) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 22px !important; font-weight: 800 !important; color: #fff !important;
    flex-shrink: 0 !important; box-shadow: 0 4px 16px rgba(200,149,26,.4) !important;
    position: relative !important; z-index: 1 !important;
}
.jmd-hero-info { flex: 1 !important; position: relative !important; z-index: 1 !important; min-width: 0 !important; }
.jmd-hero-info h2 {
    font-family: 'Baloo 2', sans-serif !important;
    font-size: 20px !important; font-weight: 800 !important;
    color: #fff !important; margin: 0 0 3px !important;
}
.jmd-hero-info p { font-size: 12.5px !important; color: rgba(255,255,255,.55) !important; margin: 0 0 10px !important; }
.jmd-hero-badges { display: flex !important; gap: 7px !important; flex-wrap: wrap !important; }

.jmd-badge {
    display: inline-flex !important; align-items: center !important; gap: 4px !important;
    padding: 3px 11px !important; border-radius: 20px !important;
    font-size: 11.5px !important; font-weight: 600 !important;
}
.jmd-badge-gold  { background: rgba(200,149,26,.2) !important; color: #f0b429 !important; border: 1px solid rgba(200,149,26,.3) !important; }
.jmd-badge-green { background: rgba(82,183,136,.2) !important; color: #7ae8b8 !important; border: 1px solid rgba(82,183,136,.3) !important; }
.jmd-badge-warn  { background: rgba(240,180,41,.2) !important; color: #fbd271 !important; border: 1px solid rgba(240,180,41,.3) !important; }

.jmd-card-id-box {
    background: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 10px !important; padding: 10px 16px !important;
    text-align: center !important; position: relative !important; z-index: 1 !important;
    flex-shrink: 0 !important;
}
.jmd-cid-label { font-size: 9.5px !important; color: rgba(255,255,255,.5) !important; letter-spacing: 1px !important; text-transform: uppercase !important; }
.jmd-cid-value { font-family: 'Baloo 2', sans-serif !important; font-size: 18px !important; font-weight: 800 !important; color: #f0b429 !important; letter-spacing: 2px !important; }

/* ── Stats ── */
.jmd-stats-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 12px !important; margin-bottom: 20px !important;
}
.jmd-stat {
    background: #fff !important; border: 1px solid #e8dfc8 !important;
    border-radius: 12px !important; padding: 16px 18px !important;
    transition: transform .18s, box-shadow .18s !important;
}
.jmd-stat:hover { transform: translateY(-2px) !important; box-shadow: 0 4px 20px rgba(26,71,49,.1) !important; }
.jmd-stat-label { font-size: 10.5px !important; color: #7a6a4a !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: .5px !important; margin-bottom: 5px !important; }
.jmd-stat-val { font-family: 'Baloo 2', sans-serif !important; font-size: 26px !important; font-weight: 800 !important; color: #1a4731 !important; line-height: 1 !important; }
.jmd-sv-green { color: #2d6a4f !important; }
.jmd-sv-gold  { color: #c8951a !important; }
.jmd-sv-red   { color: #c0392b !important; }
.jmd-stat-sub { font-size: 11px !important; color: #7a6a4a !important; margin-top: 3px !important; }

/* ── Cards grid ── */
.jmd-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    gap: 14px !important; margin-bottom: 20px !important;
}
.jmd-info-card {
    background: #fff !important; border: 1px solid #e8dfc8 !important;
    border-radius: 12px !important; padding: 18px 20px !important;
}
.jmd-info-card h3 {
    font-size: 13px !important; font-weight: 700 !important;
    color: #2d6a4f !important; margin: 0 0 12px !important;
    padding-bottom: 9px !important; border-bottom: 1px solid #f5ede0 !important;
    display: flex !important; align-items: center !important; gap: 6px !important;
}
.jmd-info-table { width: 100% !important; border-collapse: collapse !important; font-size: 13px !important; }
.jmd-info-table tr:not(:last-child) td { border-bottom: 1px solid #f5ede0 !important; }
.jmd-info-table td { padding: 6px 0 !important; vertical-align: top !important; }
.jmd-info-table td:first-child { color: #7a6a4a !important; width: 44% !important; font-weight: 500 !important; font-size: 12px !important; }
.jmd-info-table td:last-child { color: #1c1208 !important; font-weight: 600 !important; }

/* ── Pills ── */
.jmd-pill {
    display: inline-block !important;
    padding: 3px 10px !important; border-radius: 20px !important;
    font-size: 11.5px !important; font-weight: 700 !important; white-space: nowrap !important;
}
.jmd-pill-success { background: #edf7f1 !important; color: #1a4731 !important; }
.jmd-pill-warning { background: #fff8e1 !important; color: #b86e00 !important; }
.jmd-pill-danger  { background: #fff0ef !important; color: #c0392b !important; }

/* ── Notices ── */
.jmd-notice {
    border-radius: 10px !important; padding: 14px 18px !important;
    font-size: 13.5px !important; font-weight: 500 !important;
    margin: 16px 0 !important;
}
.jmd-notice-info    { background: #e8f4fd !important; color: #1565c0 !important; border-left: 3px solid #1565c0 !important; }
.jmd-notice-warning { background: #fffde7 !important; color: #7a5700 !important; border-left: 3px solid #c8951a !important; }
.jmd-notice-success { background: #edf7f1 !important; color: #1a4731 !important; border-left: 3px solid #2d6a4f !important; }
.jmd-notice-danger  { background: #fff0ef !important; color: #c0392b !important; border-left: 3px solid #c0392b !important; }

/* ── Section title ── */
.jmd-sec-title {
    font-family: 'Baloo 2', sans-serif !important;
    font-size: 20px !important; font-weight: 800 !important;
    color: #1c1208 !important;
    margin-bottom: 18px !important;
    display: flex !important; align-items: center !important; gap: 8px !important;
}
.jmd-sec-title::after {
    content: '' !important; flex: 1 !important;
    height: 2px !important; background: #e8dfc8 !important;
}

/* ── Tab bar ── */
.jmd-tab-bar {
    display: flex !important; gap: 3px !important;
    background: #f4ead6 !important;
    padding: 4px !important; border-radius: 10px !important;
    margin-bottom: 16px !important;
}
.jmd-tab {
    flex: 1 !important; padding: 8px 14px !important;
    border: none !important; background: none !important;
    border-radius: 7px !important; font-size: 13px !important;
    font-weight: 600 !important; font-family: inherit !important;
    cursor: pointer !important; color: #7a6a4a !important;
    transition: all .18s !important; white-space: nowrap !important;
}
.jmd-tab.active {
    background: #fff !important; color: #1a4731 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}

/* ── Search bar ── */
.jmd-search-bar {
    display: flex !important; gap: 10px !important;
    margin-bottom: 14px !important; flex-wrap: wrap !important;
    align-items: center !important;
}
.jmd-search-wrap { flex: 1 !important; min-width: 180px !important; position: relative !important; }
.jmd-search-wrap input {
    width: 100% !important;
    padding: 10px 14px 10px 38px !important;
    border: 1.5px solid #e8dfc8 !important; border-radius: 9px !important;
    font-size: 13px !important; font-family: inherit !important;
    background: #fff !important; color: #1c1208 !important;
    outline: none !important; transition: border-color .2s !important;
    box-sizing: border-box !important;
}
.jmd-search-wrap input:focus { border-color: #c8951a !important; }
.jmd-search-icon {
    position: absolute !important; left: 11px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 14px !important; pointer-events: none !important; color: #7a6a4a !important;
}
.jmd-filter-sel {
    padding: 10px 14px !important;
    border: 1.5px solid #e8dfc8 !important; border-radius: 9px !important;
    font-size: 13px !important; font-family: inherit !important;
    background: #fff !important; color: #3a3020 !important;
    cursor: pointer !important; outline: none !important;
}
.jmd-filter-sel:focus { border-color: #c8951a !important; }

/* ── Table ── */
.jmd-table-wrap {
    background: #fff !important; border: 1px solid #e8dfc8 !important;
    border-radius: 12px !important; overflow: hidden !important; overflow-x: auto !important;
    margin-bottom: 10px !important;
}
.jmd-table {
    width: 100% !important; border-collapse: collapse !important;
    font-size: 13px !important; min-width: 680px !important;
}
.jmd-table thead { background: #f5ede0 !important; }
.jmd-table th {
    padding: 11px 13px !important; text-align: left !important;
    font-size: 11px !important; font-weight: 700 !important;
    color: #7a6a4a !important; letter-spacing: .5px !important;
    text-transform: uppercase !important; white-space: nowrap !important;
}
.jmd-table td { padding: 11px 13px !important; border-top: 1px solid #f5ede0 !important; vertical-align: top !important; }
.jmd-table tbody tr:hover { background: #fdf9f2 !important; }
.jmd-table td strong { color: #1c1208 !important; font-size: 13.5px !important; }
.jmd-table td small { color: #7a6a4a !important; font-size: 11.5px !important; }
.jmd-code {
    background: #f5ede0 !important; padding: 2px 7px !important;
    border-radius: 5px !important; font-size: 12px !important; font-weight: 700 !important; color: #7a4e00 !important;
}
.jmd-empty {
    text-align: center !important; padding: 40px 20px !important;
    color: #7a6a4a !important; font-size: 14px !important;
}

/* ── Detail rows ── */
.jmd-detail-row { display: none !important; background: #fdf9f2 !important; }
.jmd-detail-row.open { display: table-row !important; }
.jmd-detail-row td { padding: 0 !important; border: none !important; }
.jmd-detail-box { padding: 14px 18px !important; border-top: 1px dashed #e8dfc8 !important; }
.jmd-detail-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
    gap: 12px !important; font-size: 13px !important;
}
.jmd-detail-grid > div strong {
    display: block !important; font-size: 10.5px !important; font-weight: 700 !important;
    color: #7a6a4a !important; letter-spacing: .5px !important;
    text-transform: uppercase !important; margin-bottom: 2px !important;
}
.jmd-detail-grid > div span { color: #1c1208 !important; font-weight: 500 !important; }
.jmd-dg-full { grid-column: 1 / -1 !important; }

/* ── Photo / initials ── */
.jmd-photo-cell { display: flex !important; align-items: center !important; gap: 9px !important; }
.jmd-photo-thumb {
    width: 36px !important; height: 36px !important; border-radius: 50% !important;
    object-fit: cover !important; border: 2px solid #e8dfc8 !important; flex-shrink: 0 !important;
}
.jmd-init-thumb {
    width: 36px !important; height: 36px !important; border-radius: 50% !important;
    background: #fdf3d8 !important; color: #c8951a !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    font-weight: 700 !important; font-size: 12.5px !important; flex-shrink: 0 !important;
}

/* ── Crop tags ── */
.jmd-crop-tags { display: flex !important; gap: 4px !important; flex-wrap: wrap !important; }
.jmd-crop-tag {
    background: #edf7f1 !important; color: #2d6a4f !important;
    font-size: 11px !important; font-weight: 600 !important;
    padding: 2px 7px !important; border-radius: 5px !important;
}

/* ── Action btn ── */
.jmd-action-btn {
    background: none !important; border: 1px solid #e8dfc8 !important;
    border-radius: 6px !important; padding: 5px 10px !important;
    font-size: 12px !important; font-family: inherit !important;
    cursor: pointer !important; color: #3a3020 !important;
    transition: all .18s !important; white-space: nowrap !important;
}
.jmd-action-btn:hover { background: #fdf3d8 !important; border-color: #c8951a !important; color: #c8951a !important; }

/* ── Password form ── */
.jmd-pw-form {
    max-width: 440px !important;
    background: #fff !important; border: 1px solid #e8dfc8 !important;
    border-radius: 14px !important; padding: 26px 28px !important;
}
.jmd-pw-form h3 { font-size: 17px !important; font-weight: 700 !important; color: #1c1208 !important; margin: 0 0 6px !important; }
.jmd-pw-desc { font-size: 13px !important; color: #7a6a4a !important; line-height: 1.6 !important; margin: 0 0 22px !important; }
.jmd-pw-field { margin-bottom: 18px !important; }
.jmd-pw-field label { display: block !important; font-size: 13px !important; font-weight: 600 !important; color: #3a3020 !important; margin-bottom: 6px !important; }
.jmd-pw-wrap { position: relative !important; }
.jmd-pw-wrap input {
    width: 100% !important;
    padding: 11px 40px 11px 13px !important;
    border: 1.5px solid #e8dfc8 !important; border-radius: 9px !important;
    font-size: 14px !important; font-family: inherit !important;
    background: #fafaf7 !important; color: #1c1208 !important;
    outline: none !important; transition: border-color .2s !important;
    box-sizing: border-box !important;
}
.jmd-pw-wrap input:focus { border-color: #c8951a !important; background: #fff !important; }
.jmd-pw-eye {
    position: absolute !important; right: 11px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important; border: none !important; cursor: pointer !important;
    color: #7a6a4a !important; font-size: 16px !important;
}
.jmd-pw-bars { display: flex !important; gap: 4px !important; margin-top: 6px !important; }
.jmd-pw-bar { height: 4px !important; flex: 1 !important; background: #e8dfc8 !important; border-radius: 4px !important; transition: background .3s !important; }
.jmd-pw-bar.jmd-weak   { background: #c0392b !important; }
.jmd-pw-bar.jmd-medium { background: #c8951a !important; }
.jmd-pw-bar.jmd-strong { background: #2d6a4f !important; }
.jmd-pw-hint { font-size: 12px !important; color: #7a6a4a !important; margin-top: 5px !important; }
.jmd-pw-submit {
    width: 100% !important; padding: 13px !important;
    background: linear-gradient(135deg, #2d6a4f 0%, #1a4731 100%) !important;
    color: #fff !important; border: none !important;
    border-radius: 9px !important; font-size: 15px !important;
    font-weight: 700 !important; font-family: inherit !important;
    cursor: pointer !important; margin-top: 4px !important;
    transition: opacity .2s !important;
}
.jmd-pw-submit:hover { opacity: .9 !important; }

/* ════════════════════════════════════════════════════
   REGISTRATION FORM (original styles preserved)
════════════════════════════════════════════════════ */

#jm-registration-wrap {
    max-width: 820px !important;
    margin: 30px auto !important;
}
.jm-form-header {
    background: linear-gradient(135deg, #1a4731, #c8951a) !important;
    color: #fff !important; padding: 26px 30px !important;
    border-radius: 12px 12px 0 0 !important; text-align: center !important;
}
.jm-form-header h2 { margin: 0 0 5px !important; font-size: 21px !important; font-weight: 700 !important; color: #fff !important; }
.jm-form-header p { margin: 0 !important; opacity: .85 !important; font-size: 13.5px !important; color: #fff !important; }
.jm-form {
    background: #fff !important; border: 1px solid #e8dfc8 !important;
    border-radius: 0 0 12px 12px !important; padding: 26px 30px !important;
}
.jm-form-section { margin-bottom: 26px !important; padding-bottom: 20px !important; border-bottom: 1px dashed #e8dfc8 !important; }
.jm-form-section:last-of-type { border-bottom: none !important; }
.jm-form-section h3 { font-size: 14px !important; font-weight: 700 !important; color: #2d6a4f !important; margin: 0 0 14px !important; }
.jm-row { display: flex !important; gap: 14px !important; flex-wrap: wrap !important; margin-bottom: 12px !important; }
.jm-col { flex: 1 1 210px !important; min-width: 190px !important; display: flex !important; flex-direction: column !important; }
.jm-col-full { flex: 1 1 100% !important; }
.jm-form label { font-size: 12.5px !important; font-weight: 600 !important; margin-bottom: 5px !important; color: #3a3020 !important; display: block !important; }
.jm-form .req { color: #c0392b !important; }
.jm-form input[type="text"],
.jm-form input[type="tel"],
.jm-form input[type="email"],
.jm-form input[type="number"],
.jm-form input[type="password"],
.jm-form select,
.jm-form textarea {
    width: 100% !important; padding: 10px 12px !important;
    border: 1.5px solid #e8dfc8 !important; border-radius: 8px !important;
    font-size: 13.5px !important; font-family: inherit !important;
    background: #fafafa !important; color: #1c1208 !important;
    transition: border-color .2s !important; box-sizing: border-box !important;
}
.jm-form input:focus,
.jm-form select:focus,
.jm-form textarea:focus {
    border-color: #c8951a !important; background: #fff !important;
    outline: none !important; box-shadow: 0 0 0 3px rgba(200,149,26,.12) !important;
}
.jm-form-footer { text-align: center !important; margin-top: 18px !important; }
.jm-btn-primary {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    gap: 6px !important; padding: 12px 28px !important; border-radius: 8px !important;
    font-size: 15px !important; font-weight: 700 !important; font-family: inherit !important;
    cursor: pointer !important; border: none !important;
    background: linear-gradient(135deg, #2d6a4f 0%, #1a4731 100%) !important;
    color: #fff !important; transition: all .2s !important;
    box-shadow: 0 4px 14px rgba(26,71,49,.25) !important;
}
.jm-btn-primary:hover { opacity: .9 !important; transform: translateY(-2px) !important; }
.jm-form-footer .jm-btn-primary { min-width: 200px !important; }
.jm-alert { padding: 13px 16px !important; border-radius: 8px !important; font-size: 13.5px !important; margin: 14px 0 !important; font-weight: 500 !important; }
.jm-alert-success { background: #edf7f1 !important; color: #1a4731 !important; border-left: 3px solid #2d6a4f !important; }
.jm-alert-error   { background: #fff0ef !important; color: #7a1a14 !important; border-left: 3px solid #c0392b !important; }
.jm-alert-info    { background: #e8f4fd !important; color: #1565c0 !important; border-left: 3px solid #1565c0 !important; }

/* ════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════ */

@media (max-width: 840px) {
    .jml-left { display: none !important; }
    #jm-login-page-wrap { max-width: 440px !important; }
    .jml-card { border-radius: 16px !important; }
    .jml-right-inner { padding: 32px 24px !important; }
}
@media (max-width: 860px) {
    .jmd-sidebar { display: none !important; }
    .jmd-main { padding: 16px !important; }
    .jmd-hero-card { flex-direction: column !important; text-align: center !important; }
    .jmd-card-id-box { width: 100% !important; }
    .jmd-hero-badges { justify-content: center !important; }
}
@media (max-width: 600px) {
    .jm-row { flex-direction: column !important; }
    .jmd-stats-row { grid-template-columns: repeat(2, 1fr) !important; }
}