/* ============================================================
   MediCare - Stylesheet Principal
   ============================================================ */

:root {
    /* =========================================================
       PALETĂ (din fișierul tău CSS) – teal / blue-gray
       ========================================================= */
    --negru: #333333;
    --albastru-verzui-moderat: #34555D;     /* accent închis */
    --verde-albastrui-moderat: #517F89;     /* accent principal */
    --verde-foarte-deschis: #BDDCDB;        /* accent soft */
    --gri-deschis: #D0DBDB;                 /* fundal soft */

    /* Mapare pe variabilele existente din UI (ca să nu stricăm nimic) */
    --violet-inchis: var(--albastru-verzui-moderat);
    --violet-roscat: var(--verde-albastrui-moderat);
    --violet-cenusiu: #5F737A; /* text secundar (contrast bun) */
    --verde-pal: var(--verde-albastrui-moderat);
    --galben-verde: var(--verde-foarte-deschis);

    --white: #FEFEFE;

    /* Fundal ușor tintuit (mai odihnitor decât alb “crud”) */
    --light-bg: #EEF5F5;
    --dark-text: var(--negru);

    /* Semantice */
    --danger: #E74C3C;
    --success: #27AE60;
    --warning: #F39C12;
    --info: #3498DB;

    /* =========================================================
       THEME PREMIUM - accente color + “glass” soft
       ========================================================= */
    --app-grad-1: rgba(52, 85, 93, 0.20);    /* #34555D */
    --app-grad-2: rgba(81, 127, 137, 0.20);  /* #517F89 */
    --app-grad-3: rgba(189, 220, 219, 0.18); /* #BDDCDB */

    --surface: rgba(255, 255, 255, 0.88);
    --surface-strong: rgba(255, 255, 255, 0.94);
    --surface-soft: rgba(208, 219, 219, 0.55);

    --border-soft: rgba(81, 127, 137, 0.14);
    --shadow-soft: 0 10px 28px rgba(51, 51, 51, 0.08);
    --shadow-strong: 0 16px 40px rgba(81, 127, 137, 0.18);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    background:
      radial-gradient(1200px 700px at 18% -8%, var(--app-grad-1), transparent 55%),
      radial-gradient(1000px 650px at 110% 8%, var(--app-grad-2), transparent 55%),
      radial-gradient(900px 520px at 35% 105%, var(--app-grad-3), transparent 55%),
      linear-gradient(180deg, #F0F7F7 0%, var(--light-bg) 55%, #EEF5F5 100%);
    color: var(--dark-text);
    line-height: 1.5;
}

a { color: var(--violet-roscat); text-decoration: none; }
a:hover { text-decoration: underline; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--light-bg); }
::-webkit-scrollbar-thumb { background: rgba(81,127,137,0.4); border-radius: 3px; }

/* Animations */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes slideIn { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }

/* ============================================================
   LOGIN PAGE — PREMIUM DARK/LIGHT SPLIT
   ============================================================ */

/* ── Shell ── */
.lp {
    display: flex;
    min-height: 100vh;
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, rgba(52,85,93,0.92) 0%, rgba(81,127,137,0.82) 49.85%, #F6FBFB 49.85%, #EEF5F5 100%);
}

/* ── Ambient Dark Background ── */
.lp-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 140% 80% at 0% 0%, rgba(52,85,93,0.95), transparent 60%),
        radial-gradient(ellipse 100% 100% at 100% 100%, rgba(81,127,137,0.6), transparent 50%),
        radial-gradient(ellipse 80% 60% at 50% 120%, rgba(189,220,219,0.3), transparent 50%),
        linear-gradient(160deg, #0B1D24 0%, #132F38 30%, #1A3A44 60%, #0F2027 100%);
}

/* Aurora bands */
.lp-aurora {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
    opacity: 0.5;
}

.lp-aurora-band {
    position: absolute;
    width: 200%;
    height: 300px;
    border-radius: 50%;
    filter: blur(80px);
    will-change: transform;
}

.lp-aurora-band:nth-child(1) {
    background: linear-gradient(90deg, transparent, rgba(81,127,137,0.35), rgba(189,220,219,0.2), transparent);
    top: -5%;
    left: -20%;
    animation: auroraFlow1 18s ease-in-out infinite;
}
.lp-aurora-band:nth-child(2) {
    background: linear-gradient(90deg, transparent, rgba(52,85,93,0.25), rgba(81,127,137,0.15), transparent);
    top: 25%;
    left: -30%;
    animation: auroraFlow2 22s ease-in-out infinite 3s;
}
.lp-aurora-band:nth-child(3) {
    background: linear-gradient(90deg, transparent, rgba(189,220,219,0.15), rgba(81,127,137,0.2), transparent);
    bottom: 10%;
    left: -15%;
    animation: auroraFlow3 20s ease-in-out infinite 6s;
}

@keyframes auroraFlow1 {
    0%, 100% { transform: translateX(-10%) rotate(-3deg) scaleY(1); }
    33% { transform: translateX(5%) rotate(1deg) scaleY(1.3); }
    66% { transform: translateX(-5%) rotate(-1deg) scaleY(0.8); }
}
@keyframes auroraFlow2 {
    0%, 100% { transform: translateX(5%) rotate(2deg); }
    50% { transform: translateX(-8%) rotate(-2deg); }
}
@keyframes auroraFlow3 {
    0%, 100% { transform: translateX(-3%) rotate(-1deg) scaleY(1.1); }
    50% { transform: translateX(6%) rotate(2deg) scaleY(0.9); }
}

/* Noise texture overlay */
.lp-noise {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.025;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 256px 256px;
}

/* Floating particles */
.lp-particles {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.lp-particle {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(189,220,219,0.3);
}

.lp-particle:nth-child(1) { top: 15%; left: 10%; animation: particleFloat 12s ease-in-out infinite; }
.lp-particle:nth-child(2) { top: 35%; left: 25%; width: 2px; height: 2px; animation: particleFloat 16s ease-in-out infinite 2s; }
.lp-particle:nth-child(3) { top: 60%; left: 8%; animation: particleFloat 14s ease-in-out infinite 4s; }
.lp-particle:nth-child(4) { top: 80%; left: 35%; width: 4px; height: 4px; animation: particleFloat 18s ease-in-out infinite 1s; }
.lp-particle:nth-child(5) { top: 20%; left: 40%; width: 2px; height: 2px; animation: particleFloat 20s ease-in-out infinite 5s; }
.lp-particle:nth-child(6) { top: 45%; left: 15%; animation: particleFloat 15s ease-in-out infinite 3s; }
.lp-particle:nth-child(7) { top: 70%; left: 42%; width: 2px; height: 2px; animation: particleFloat 17s ease-in-out infinite 7s; }

@keyframes particleFloat {
    0%, 100% { transform: translate(0, 0); opacity: 0.3; }
    25% { transform: translate(15px, -20px); opacity: 0.6; }
    50% { transform: translate(-10px, -35px); opacity: 0.2; }
    75% { transform: translate(20px, -15px); opacity: 0.5; }
}

/* ── LEFT PANEL — Dark Branding ── */
.lp-brand {
    flex: 0 0 50%;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 56px;
    overflow: hidden;
    /* Match app hero headers (teal gradient + subtle depth) */
    background: linear-gradient(135deg,
        rgba(52, 85, 93, 0.92) 0%,
        rgba(81, 127, 137, 0.82) 55%,
        rgba(90, 155, 163, 0.72) 100%);
    box-shadow: inset -1px 0 0 rgba(255,255,255,0.06);
}

/* Hero mesh overlay (same as .cabinet-header-banner) */
.lp-brand::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
}

/* Soft premium light orbs */
.lp-brand::after {
    content: '';
    position: absolute;
    inset: -120px;
    background:
        radial-gradient(500px 420px at 25% 22%, rgba(189,220,219,0.22), transparent 60%),
        radial-gradient(520px 460px at 70% 85%, rgba(255,255,255,0.10), transparent 62%);
    pointer-events: none;
    opacity: 0.85;
}

.lp-brand-inner {
    display: flex;
    flex-direction: column;
    gap: 40px;
    max-width: 480px;
    width: 100%;
    animation: lpRevealLeft 1s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: 0.1s;
    position: relative;
    z-index: 2;
}

@keyframes lpRevealLeft {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ── Hero Section ── */
.lp-hero {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.lp-hero-logo {
    display: flex;
    align-items: center;
    gap: 18px;
}

.lp-logo-icon {
    width: 68px;
    height: 68px;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--verde-albastrui-moderat), var(--verde-foarte-deschis));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    box-shadow:
        0 0 0 1px rgba(189,220,219,0.15),
        0 16px 48px rgba(0,0,0,0.4),
        0 0 60px rgba(81,127,137,0.2);
    position: relative;
    flex-shrink: 0;
}

.lp-logo-icon::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(189,220,219,0.3), transparent 50%);
    z-index: -1;
    opacity: 0.6;
}

.lp-logo-img-wrap {
    width: 68px;
    height: 68px;
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255,255,255,0.95);
    border: 1px solid rgba(189,220,219,0.2);
    box-shadow:
        0 0 0 1px rgba(189,220,219,0.1),
        0 16px 48px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}

.lp-logo-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 6px;
}

.lp-logo-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--verde-albastrui-moderat);
}

.lp-hero-text {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lp-hero-name-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.lp-brand-name {
    font-family: 'Playfair Display', 'DM Sans', serif;
    font-size: 38px;
    font-weight: 800;
    color: #F0F8F7;
    letter-spacing: -0.5px;
    line-height: 1;
    margin: 0;
    text-shadow: 0 2px 20px rgba(0,0,0,0.3);
}

.lp-pro-badge {
    display: inline-flex;
    align-items: center;
    font-size: 10px;
    font-weight: 800;
    padding: 5px 14px;
    border-radius: 8px;
    background: rgba(189,220,219,0.12);
    color: var(--verde-foarte-deschis);
    letter-spacing: 3px;
    border: 1px solid rgba(189,220,219,0.15);
    backdrop-filter: blur(10px);
    height: fit-content;
}

.lp-tagline {
    font-size: 16px;
    line-height: 1.7;
    color: rgba(189,220,219,0.5);
    font-weight: 400;
    margin: 0;
    max-width: 360px;
}

/* ── Heartbeat Line — Medical signature ── */
.lp-heartbeat {
    width: 100%;
    height: 60px;
    position: relative;
    overflow: hidden;
    opacity: 0.3;
}

.lp-heartbeat svg {
    width: 100%;
    height: 100%;
}

.lp-heartbeat-line {
    stroke: var(--verde-foarte-deschis);
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 600;
    stroke-dashoffset: 600;
    animation: heartbeatDraw 3s ease-out forwards 0.8s;
}

.lp-heartbeat-glow {
    stroke: var(--verde-foarte-deschis);
    stroke-width: 6;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 600;
    stroke-dashoffset: 600;
    animation: heartbeatDraw 3s ease-out forwards 0.8s;
    filter: blur(4px);
    opacity: 0.4;
}

@keyframes heartbeatDraw {
    to { stroke-dashoffset: 0; }
}

/* ── Contact Info Card (dark glass) ── */
.lp-info-card {
    background: rgba(255,255,255,0.04);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-radius: 20px;
    border: 1px solid rgba(189,220,219,0.08);
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lp-info-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(189,220,219,0.35);
}

.lp-info-rows {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lp-info-row {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.lp-info-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 11px;
    background: rgba(81,127,137,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--verde-foarte-deschis);
    border: 1px solid rgba(189,220,219,0.06);
}

.lp-info-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.lp-info-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(189,220,219,0.3);
}

.lp-info-value {
    font-size: 14px;
    font-weight: 600;
    color: rgba(240,248,247,0.75);
    word-break: break-word;
}

.lp-info-link {
    text-decoration: none;
    color: rgba(240,248,247,0.75);
    transition: color 0.2s;
}
.lp-info-link:hover {
    color: var(--verde-foarte-deschis);
    text-decoration: none;
}

/* ── Feature pills (dark) ── */
.lp-features {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.lp-feature {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 12px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(189,220,219,0.08);
    color: rgba(189,220,219,0.5);
    font-size: 13px;
    font-weight: 600;
    transition: all 0.3s ease;
    backdrop-filter: blur(8px);
}

.lp-feature:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(189,220,219,0.15);
    color: rgba(189,220,219,0.75);
}

.lp-feature-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: rgba(81,127,137,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--verde-foarte-deschis);
    flex-shrink: 0;
}

/* ── MINI SIDEBAR (Login) — Preview menu ── */
.lp-menu-card {
    position: relative;
    border-radius: 18px;
    background: rgba(255,255,255,0.045);
    border: 1px solid rgba(189,220,219,0.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 14px;
    overflow: hidden;
}

.lp-menu-card::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
}

.lp-menu-title {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(189,220,219,0.70);
    margin-bottom: 10px;
}

.lp-menu-title .lp-menu-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lp-menu-lock {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 4px 8px;
    border-radius: 10px;
    background: rgba(0,0,0,0.10);
    border: 1px solid rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.55);
}

.lp-menu-items {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lp-menu-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(0,0,0,0.06);
    color: rgba(255,255,255,0.78);
    cursor: pointer;
    text-decoration: none;
    transition: all 0.22s ease;
    user-select: none;
}

.lp-menu-item:hover {
    transform: translateX(4px);
    background: rgba(255,255,255,0.10);
    border-color: rgba(189,220,219,0.18);
    color: rgba(255,255,255,0.92);
}

.lp-menu-ico {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.12);
}

.lp-menu-ico svg { width: 18px; height: 18px; }

.lp-menu-label {
    font-size: 13px;
    font-weight: 700;
}

.lp-menu-hint {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    font-size: 12px;
    color: rgba(189,220,219,0.55);
}

/* ── RIGHT PANEL — Light Form ── */
.lp-form-side {
    flex: 1;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 48px;
    background: linear-gradient(165deg, #F6FBFB, #EEF5F5, #F0F7F7);
    /* separator curat fara decupajele din coltul stanga-sus / stanga-jos */
    border-radius: 0;
    box-shadow:
        inset 1px 0 0 rgba(255,255,255,0.55),
        -30px 0 80px rgba(0,0,0,0.12);
    overflow: hidden;
}

/* Subtle grain on light side */
.lp-form-side::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 200px;
    opacity: 0.015;
    pointer-events: none;
}

/* Soft light orb on form side */
.lp-form-side::after {
    content: '';
    position: absolute;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(189,220,219,0.15), transparent 65%);
    top: -15%;
    right: -10%;
    pointer-events: none;
}

.lp-form-wrapper {
    width: 100%;
    max-width: 440px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    animation: lpRevealRight 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: 0.25s;
    position: relative;
    z-index: 1;
}

@keyframes lpRevealRight {
    from { opacity: 0; transform: translateY(25px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Mobile logo — hidden on desktop */
.lp-mobile-logo {
    display: none;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-bottom: 4px;
}

.lp-mobile-logo-icon,
.lp-mobile-logo-img {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Mesh overlay for "green" accents (same effect as hero headers) */
.lp-mobile-logo-icon::after,
.lp-mobile-logo-img::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0.10;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

.lp-mobile-logo-icon {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    border: 1px solid rgba(81,127,137,0.15);
    color: white;
    box-shadow: 0 6px 20px rgba(52,85,93,0.25);
}

.lp-mobile-logo-img {
    background: white;
    border: 1px solid rgba(81,127,137,0.15);
    box-shadow: 0 6px 20px rgba(52,85,93,0.12);
}

.lp-mobile-logo-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 4px;
}

.lp-mobile-brand {
    font-family: 'Playfair Display', 'DM Sans', serif;
    font-size: 24px;
    font-weight: 800;
    color: var(--albastru-verzui-moderat);
}

.lp-mobile-pro {
    font-size: 9px;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(81,127,137,0.08);
    color: var(--verde-albastrui-moderat);
    letter-spacing: 2px;
    border: 1px solid rgba(81,127,137,0.1);
}

/* ── Glass Card ── */
.lp-card {
    background: rgba(255,255,255,0.72);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    border-radius: 28px;
    border: 1px solid rgba(255,255,255,0.85);
    box-shadow:
        0 1px 0 rgba(255,255,255,1) inset,
        0 30px 100px rgba(52,85,93,0.08),
        0 8px 32px rgba(52,85,93,0.05);
    overflow: hidden;
    position: relative;
}

/* Shimmer line at top of card */
.lp-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg,
        transparent,
        var(--verde-foarte-deschis),
        var(--verde-albastrui-moderat),
        var(--verde-foarte-deschis),
        transparent
    );
    opacity: 0.5;
}

.lp-card-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 32px 36px 0;
}

.lp-card-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: linear-gradient(145deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    box-shadow:
        0 10px 30px rgba(52,85,93,0.3),
        0 0 0 1px rgba(255,255,255,0.1) inset;
    flex-shrink: 0;
    position: relative;
}

/* Mesh overlay (match hero headers) */
.lp-card-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0.10;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

/* Pulse ring on lock icon */
.lp-card-icon::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 20px;
    border: 2px solid rgba(81,127,137,0.15);
    animation: iconPulse 3s ease-in-out infinite;
}

@keyframes iconPulse {
    0%, 100% { transform: scale(1); opacity: 0.5; }
    50% { transform: scale(1.08); opacity: 0; }
}

.lp-card-title {
    font-family: 'Playfair Display', 'DM Sans', serif;
    font-size: 24px;
    font-weight: 800;
    color: var(--albastru-verzui-moderat);
    margin: 0;
    line-height: 1.2;
}

.lp-card-sub {
    font-size: 13px;
    color: rgba(52,85,93,0.55);
    margin: 4px 0 0;
    font-weight: 500;
}

/* ── Form ── */
.lp-form {
    padding: 28px 36px 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.lp-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lp-label {
    font-size: 12px;
    font-weight: 700;
    color: rgba(52,85,93,0.6);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.lp-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    border-radius: 16px;
    border: 2px solid rgba(81,127,137,0.12);
    background: rgba(255,255,255,0.65);
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    overflow: hidden;
}

.lp-input-wrap.focused,
.lp-input-wrap:focus-within {
    border-color: var(--verde-albastrui-moderat);
    background: white;
    box-shadow:
        0 0 0 4px rgba(81,127,137,0.08),
        0 4px 20px rgba(52,85,93,0.06);
    transform: translateY(-1px);
}

.lp-input-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(81,127,137,0.3);
    pointer-events: none;
    transition: all 0.35s;
    z-index: 1;
}

.lp-input-wrap.focused .lp-input-icon,
.lp-input-wrap:focus-within .lp-input-icon {
    color: var(--verde-albastrui-moderat);
    transform: translateY(-50%) scale(1.05);
}

.lp-input {
    width: 100%;
    padding: 16px 16px 16px 50px;
    border: none;
    background: transparent;
    font-size: 15px;
    font-family: inherit;
    color: var(--albastru-verzui-moderat);
    outline: none;
    min-height: 54px;
    font-weight: 500;
}

.lp-input::placeholder {
    color: rgba(81,127,137,0.3);
    font-weight: 400;
}

.lp-input:-webkit-autofill,
.lp-input:-webkit-autofill:hover,
.lp-input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--albastru-verzui-moderat);
    -webkit-box-shadow: 0 0 0 1000px rgba(255,255,255,0.95) inset;
    transition: background-color 5000s ease-in-out 0s;
}

/* Toggle password */
.lp-toggle-pass {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 12px;
    color: rgba(81,127,137,0.35);
    cursor: pointer;
    transition: all 0.25s;
    flex-shrink: 0;
    margin-right: 5px;
}

.lp-toggle-pass:hover {
    color: var(--verde-albastrui-moderat);
    background: rgba(81,127,137,0.06);
}

/* Remember me */
.lp-remember {
    padding-top: 2px;
}

.lp-check {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.lp-check input {
    display: none;
}

.lp-checkmark {
    width: 22px;
    height: 22px;
    border-radius: 8px;
    border: 2px solid rgba(81,127,137,0.18);
    background: rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    flex-shrink: 0;
}

.lp-check input:checked + .lp-checkmark {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    border-color: var(--verde-albastrui-moderat);
    color: white;
    box-shadow: 0 4px 14px rgba(52,85,93,0.3);
    transform: scale(1.05);
}

.lp-check-text {
    font-size: 13px;
    color: rgba(52,85,93,0.55);
    font-weight: 500;
}

/* ── Submit button ── */
.lp-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 17px 28px;
    border: none;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    font-size: 16px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow:
        0 10px 35px rgba(52,85,93,0.35),
        0 0 0 1px rgba(255,255,255,0.08) inset;
    min-height: 56px;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.3px;
}

/* Mesh overlay — same effect as hero headers */
.lp-submit::after {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.085;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 36px 36px;
    pointer-events: none;
    z-index: 1;
}

.lp-submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 200%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
    transition: left 0.7s ease;
    z-index: 2;
}

.lp-submit > * {
    position: relative;
    z-index: 3;
}

.lp-submit:hover {
    transform: translateY(-2px);
    box-shadow:
        0 16px 48px rgba(52,85,93,0.45),
        0 0 0 1px rgba(255,255,255,0.1) inset;
}

.lp-submit:hover::before {
    left: 100%;
}

.lp-submit:active {
    transform: translateY(0);
    box-shadow: 0 6px 20px rgba(52,85,93,0.35);
}

.lp-submit svg {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.lp-submit:hover svg {
    transform: translateX(5px);
}

/* ── PWA / Shortcut install button ── */
.lp-install-btn {
    margin-top: 12px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 16px;
    border: 1px solid rgba(81,127,137,0.16);
    background: rgba(255,255,255,0.65);
    color: rgba(52,85,93,0.78);
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    user-select: none;
}

.lp-install-btn:hover {
    transform: translateY(-1px);
    background: rgba(255,255,255,0.82);
    border-color: rgba(81,127,137,0.22);
    color: rgba(52,85,93,0.92);
    box-shadow: 0 10px 28px rgba(52,85,93,0.10);
}

.lp-install-btn:active {
    transform: translateY(0);
    box-shadow: 0 6px 18px rgba(52,85,93,0.10);
}

.lp-install-btn svg {
    color: rgba(39,174,96,0.85);
}

/* Card footer */
.lp-card-footer {
    padding: 14px 36px 22px;
    display: flex;
    justify-content: center;
    border-top: 1px solid rgba(81,127,137,0.06);
}

.lp-secure {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: rgba(52,85,93,0.35);
    font-weight: 500;
}

.lp-secure svg {
    color: rgba(39,174,96,0.65);
}

/* Setup link */
.lp-setup {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

.lp-setup-label {
    font-size: 13px;
    color: rgba(52,85,93,0.4);
    font-weight: 500;
}

.lp-setup-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 18px;
    border-radius: 12px;
    border: 1px solid rgba(81,127,137,0.12);
    background: rgba(255,255,255,0.55);
    color: rgba(52,85,93,0.6);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
}

.lp-setup-btn:hover {
    background: white;
    border-color: rgba(81,127,137,0.2);
    color: var(--verde-albastrui-moderat);
    box-shadow: 0 4px 16px rgba(52,85,93,0.08);
    text-decoration: none;
}

/* Copyright */
.lp-copy {
    text-align: center;
    font-size: 11px;
    color: rgba(52,85,93,0.25);
    font-weight: 500;
}

/* ============================================================
   LOGIN — RESPONSIVE
   ============================================================ */

@media (max-width: 1100px) {
    .lp-brand { flex: 0 0 44%; padding: 40px 36px; }
    .lp-brand-name { font-size: 32px; }
    .lp-brand-inner { gap: 30px; }
    .lp-logo-icon,
    .lp-logo-img-wrap {
        width: 58px; height: 58px;
        border-radius: 18px;
    }
    .lp-info-card { padding: 20px 22px; }
}

/* Tablet portrait — stack & hide brand */
@media (max-width: 900px) {
    .lp {
        flex-direction: column;
        min-height: 100vh;
    }
    .lp-brand {
        display: none;
    }
    .lp-form-side {
        border-radius: 0;
        flex: 1;
        min-height: 100vh;
        padding: 32px 24px;
        background: linear-gradient(165deg, #F6FBFB, #EEF5F5);
    }
    .lp-mobile-logo { display: flex; }
    .lp-form-wrapper { max-width: 420px; }
    .lp-aurora,
    .lp-particles,
    .lp-noise { display: none; }
}

/* Phone */
@media (max-width: 640px) {
    .lp-form-side {
        padding: 24px 16px;
        align-items: flex-start;
        padding-top: 60px;
    }
    .lp-form-wrapper { max-width: 100%; }
    .lp-card { border-radius: 22px; }
    .lp-card-header { padding: 24px 24px 0; }
    .lp-form { padding: 22px 24px 26px; }
    .lp-card-footer { padding: 12px 24px 18px; }
    .lp-card-title { font-size: 20px; }
    .lp-card-icon { width: 44px; height: 44px; border-radius: 14px; }
    .lp-submit { min-height: 52px; border-radius: 14px; }
    .lp-input-wrap { border-radius: 14px; }
    .lp-setup { flex-direction: column; gap: 6px; }
}

/* Small phone */
@media (max-width: 380px) {
    .lp-form-side {
        padding: 16px 10px;
        padding-top: 40px;
    }
    .lp-card { border-radius: 18px; }
    .lp-card-header { padding: 20px 20px 0; }
    .lp-form { padding: 18px 20px 22px; }
    .lp-card-title { font-size: 18px; }
    .lp-card-icon { width: 42px; height: 42px; border-radius: 14px; }
    .lp-mobile-brand { font-size: 20px; }
}

/* Landscape phone */
@media (max-height: 500px) and (orientation: landscape) {
    .lp { flex-direction: row; }
    .lp-brand {
        display: flex;
        flex: 0 0 36%;
        padding: 20px;
    }
    .lp-brand-inner { gap: 14px; }
    .lp-features { display: none; }
    .lp-menu-card { display: none; }
    .lp-heartbeat { display: none; }
    .lp-info-card { padding: 12px 14px; gap: 8px; }
    .lp-info-rows { gap: 6px; }
    .lp-info-icon { width: 28px; height: 28px; min-width: 28px; }
    .lp-info-value { font-size: 12px; }
    .lp-logo-icon,
    .lp-logo-img-wrap {
        width: 48px; height: 48px;
        border-radius: 14px;
    }
    .lp-brand-name { font-size: 22px; }
    .lp-tagline { display: none; }
    .lp-form-side { padding: 16px; border-radius: 0; }
    .lp-card-header { padding: 16px 20px 0; }
    .lp-form { padding: 14px 20px 16px; gap: 10px; }
    .lp-input { min-height: 42px; padding: 10px 10px 10px 46px; }
    .lp-submit { min-height: 44px; padding: 10px 20px; }
}

/* Safe area */
@supports (padding: env(safe-area-inset-top)) {
    .lp-form-side {
        padding-top: calc(20px + env(safe-area-inset-top));
        padding-bottom: calc(20px + env(safe-area-inset-bottom));
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .lp-aurora-band { animation: none !important; }
    .lp-particle { animation: none !important; }
    .lp-heartbeat-line,
    .lp-heartbeat-glow {
        animation: none !important;
        stroke-dashoffset: 0;
    }
    .lp-card-icon::after { animation: none !important; }
    .lp-brand-inner,
    .lp-form-wrapper { animation: none !important; opacity: 1; }
}

/* Legacy login classes (used by Setup Wizard) */
.login-container{
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 16px;
}
.login-card{
  width: 100%;
  max-width: 760px;
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.8);
  box-shadow: 0 24px 80px rgba(52,85,93,0.10), 0 4px 16px rgba(52,85,93,0.06), inset 0 1px 0 rgba(255,255,255,0.9);
  overflow: hidden;
}
.login-header{
  padding: 28px 32px 10px;
  border-bottom: 1px solid rgba(81,127,137,0.10);
}
.login-logo{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.login-logo-icon{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
  color: #fff;
  box-shadow: 0 8px 24px rgba(52,85,93,0.25);
  flex: 0 0 auto;
}
.login-logo-imgwrap{ background: #fff; }
.login-logo-img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 4px;
}
.login-logo-text{
  font-weight: 900;
  letter-spacing: -0.3px;
  color: var(--albastru-verzui-moderat);
  font-size: 18px;
}
.login-title{
  font-size: 22px;
  font-weight: 900;
  color: var(--albastru-verzui-moderat);
  margin: 0;
}
.login-subtitle{
  font-size: 13px;
  color: rgba(52,85,93,0.60);
  margin-top: 6px;
}


.provider-logo-wrap {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 14px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,255,255,0.65));
}

.provider-logo-preview {
    width: 140px;
    height: 120px;
    border-radius: 14px;
    border: 1px dashed var(--border-soft);
    background: rgba(0,0,0,0.02);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.provider-logo-preview img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    background: rgba(255,255,255,0.9);
    border-radius: 12px;
}

.provider-logo-placeholder {
    font-weight: 700;
    font-size: 12px;
    color: var(--violet-cenusiu);
    letter-spacing: 1px;
}

.provider-logo-actions .form-control[type="file"] {
    padding: 10px;
}

@media (max-width: 768px) {
    .provider-logo-wrap { grid-template-columns: 1fr; }
    .provider-logo-preview { width: 100%; }
}

/* Legacy login footer/setup (kept for backward compat) */
.login-footer { margin-top: 24px; text-align: center; font-size: 12px; color: var(--violet-cenusiu); display: none; }

.login-setup {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--light-bg);
    text-align: center;
    display: none;
}

.login-setup-title {
    font-size: 12px;
    color: var(--violet-cenusiu);
    margin-bottom: 10px;
}

.login-setup-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}


/* ============================================================
   APP LAYOUT
   ============================================================ */
.app { min-height: 100vh; }

/* Shell layout (sidebar + main) under fixed topbar */
.app-shell {
    display: flex;
    min-height: 100vh;
    padding-top: 68px;
    box-sizing: border-box;
}


/* ============================================================
   SIDEBAR PREMIUM - Floating Cards Design
   ============================================================ */

/* Mobile Toggle Button */
.sidebar-mobile-toggle {
    display: none;
    position: fixed;
    top: 18px;
    left: 18px;
    z-index: 250;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    border: none;
    border-radius: 12px;
    color: white;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.3);
    transition: all 0.3s ease;
}

.sidebar-mobile-toggle:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 24px rgba(52, 85, 93, 0.4);
}

.sidebar-mobile-toggle svg {
    width: 22px;
    height: 22px;
}

/* Sidebar Overlay (mobile) */
.sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(51, 51, 51, 0.5);
    backdrop-filter: blur(4px);
    z-index: 130;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.sidebar-overlay.active {
    display: block;
    opacity: 1;
}

/* Sidebar Container */
.sidebar-premium {
    width: 290px;
    position: fixed;
    top: 68px;
    left: 0;
    height: calc(100vh - 68px);
    z-index: 140;
    padding: 14px;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Floating Card Base */
.sidebar-card {
    position: relative;
    background: linear-gradient(180deg, 
        rgba(52, 85, 93, 0.92) 0%, 
        rgba(81, 127, 137, 0.85) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid rgba(189, 220, 219, 0.2);
    box-shadow: 
        0 10px 40px rgba(52, 85, 93, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
}

/* Mesh overlay — same premium effect as hero headers */
.sidebar-card::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.05;
    background-image:
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
    z-index: 0;
}

.sidebar-card > * {
    position: relative;
    z-index: 1;
}

.sidebar-card:hover {
    box-shadow: 
        0 14px 50px rgba(52, 85, 93, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

/* Header Card */
.sidebar-header-card {
    padding: 18px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sidebar-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    overflow: hidden;
}

.sidebar-logo-icon {
    min-width: 48px;
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.25);
    transition: all 0.3s ease;
}

.sidebar-logo-icon:hover {
    transform: rotate(8deg) scale(1.05);
    background: rgba(255, 255, 255, 0.22);
}

.sidebar-logo-icon svg {
    width: 26px;
    height: 26px;
    color: white;
}

.sidebar-logo-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
}

.logo-name {
    font-size: 24px;
    font-weight: 900;
    color: white;
    letter-spacing: -0.5px;
    line-height: 1;
}

.logo-badge {
    display: inline-block;
    width: fit-content;
    font-size: 9px;
    font-weight: 700;
    padding: 3px 10px;
    background: linear-gradient(135deg, var(--verde-foarte-deschis), var(--gri-deschis));
    color: var(--albastru-verzui-moderat);
    border-radius: 6px;
    letter-spacing: 1px;
}

.sidebar-collapse-btn {
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.sidebar-collapse-btn:hover {
    background: rgba(255, 255, 255, 0.2);
    color: white;
}

.sidebar-collapse-btn svg {
    width: 18px;
    height: 18px;
    transition: transform 0.3s ease;
}

/* Nav Card */
.sidebar-nav-card {
    flex: 1;
    padding: 16px 14px;
    overflow-y: auto;
    overflow-x: hidden;
}

.sidebar-nav-card::-webkit-scrollbar {
    width: 4px;
}

.sidebar-nav-card::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-nav-card::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 2px;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nav-section {
    margin-bottom: 12px;
}

.nav-section:last-child {
    margin-bottom: 0;
}

.nav-section-label {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(189, 220, 219, 0.6);
    padding: 0 10px 10px;
    display: block;
}

/* Header row pentru secțiune (label + buton collapse ">") */
.nav-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px 10px;
    gap: 10px;
}

.nav-section-header .nav-section-label {
    padding: 0;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.75);
    cursor: pointer;
    transition: all 0.25s ease;
    margin-bottom: 3px;
    text-decoration: none;
    position: relative;
}

.nav-item:hover {
    background: rgba(255, 255, 255, 0.1);
    color: white;
    transform: translateX(4px);
    text-decoration: none;
}

.nav-item.active {
    background: rgba(255, 255, 255, 0.95);
    color: var(--albastru-verzui-moderat);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    transform: none;
}

.nav-item.active:hover {
    transform: none;
}

.nav-icon {
    min-width: 20px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-icon svg {
    width: 20px;
    height: 20px;
}

.nav-label {
    font-size: 13px;
    font-weight: 600;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nav-badge {
    padding: 3px 10px;
    background: linear-gradient(135deg, var(--verde-foarte-deschis), var(--gri-deschis));
    color: var(--albastru-verzui-moderat);
    font-size: 10px;
    font-weight: 700;
    border-radius: 12px;
    margin-left: auto;
    animation: pulse-badge 2s ease-in-out infinite;
}

.nav-item.active .nav-badge {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    animation: none;
}

/* Submeniu (Programări -> Program medici) */
.nav-parent {
    margin-bottom: 4px;
}

.nav-item.has-children {
    padding-right: 10px;
}

.nav-item.disabled {
    opacity: 0.85;
}

.nav-chevron {
    min-width: 16px;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.7;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.nav-chevron svg {
    width: 16px;
    height: 16px;
}

.nav-parent.open .nav-chevron {
    transform: rotate(90deg);
    opacity: 1;
}

.nav-submenu {
    margin-left: 30px;
    padding-left: 10px;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
    display: none;
}

.nav-parent.open > .nav-submenu {
    display: block;
}

.nav-submenu .nav-item {
    padding: 10px 12px;
    border-radius: 10px;
    margin-bottom: 2px;
}

.nav-submenu .nav-label {
    font-size: 12px;
    font-weight: 600;
}

.nav-submenu .nav-icon svg {
    width: 18px;
    height: 18px;
}

.sidebar-premium.collapsed .nav-submenu {
    display: none !important;
}

.sidebar-premium.collapsed .nav-chevron {
    display: none;
}

@keyframes pulse-badge {
    0%, 100% { box-shadow: 0 0 0 0 rgba(189, 220, 219, 0.5); }
    50% { box-shadow: 0 0 0 6px rgba(189, 220, 219, 0); }
}

/* User Card */
.sidebar-user-card {
    padding: 14px;
}

.sidebar-user {
    display: flex;
    align-items: center;
    gap: 10px;
}

.user-avatar {
    min-width: 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.3);
    flex-shrink: 0;
}

.user-info {
    flex: 1;
    overflow: hidden;
}

.user-name {
    font-size: 13px;
    font-weight: 700;
    color: white;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-role {
    font-size: 11px;
    color: rgba(189, 220, 219, 0.7);
}

.user-logout {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.user-logout:hover {
    background: rgba(239, 68, 68, 0.25);
    color: #fca5a5;
}

.user-logout svg {
    width: 18px;
    height: 18px;
}

/* ============================================================
   SIDEBAR COLLAPSED STATE
   ============================================================ */
.sidebar-premium.collapsed {
    width: 94px;
}

.sidebar-premium.collapsed .sidebar-header-card {
    padding: 14px;
    justify-content: center;
}

.sidebar-premium.collapsed .sidebar-logo-text {
    display: none;
}

.sidebar-premium.collapsed .sidebar-collapse-btn svg {
    transform: rotate(180deg);
}

.sidebar-premium.collapsed .sidebar-nav-card {
    padding: 12px 10px;
}

.sidebar-premium.collapsed .nav-section-label {
    display: none;
}

.sidebar-premium.collapsed .nav-section-header {
    justify-content: center;
    padding: 0 0 10px;
}

.sidebar-premium.collapsed .nav-section-header {
    justify-content: center;
    padding: 0 0 10px;
}

.sidebar-premium.collapsed .nav-item {
    justify-content: center;
    padding: 12px;
    gap: 0;
}

.sidebar-premium.collapsed .nav-label {
    display: none;
}

.sidebar-premium.collapsed .nav-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    padding: 2px 6px;
    font-size: 9px;
    margin-left: 0;
}

.sidebar-premium.collapsed .sidebar-user-card {
    padding: 12px 10px;
}

.sidebar-premium.collapsed .sidebar-user {
    flex-direction: column;
    gap: 8px;
}

.sidebar-premium.collapsed .user-info {
    display: none;
}

.sidebar-premium.collapsed .user-logout {
    width: 100%;
    height: 34px;
    border-radius: 10px;
}

/* ============================================================
   SIDEBAR RESPONSIVE / MOBILE
   ============================================================ */
@media (max-width: 1024px) {
    .sidebar-mobile-toggle {
        display: flex;
    }
    
    .sidebar-premium {
        transform: translateX(-100%);
        top: 0;
        height: 100vh;
        padding: 14px;
        z-index: 200;
    }
    
    .sidebar-premium.mobile-open {
        transform: translateX(0);
    }
    
    .sidebar-premium.collapsed {
        width: 290px;
    }
    
    .sidebar-premium.collapsed .sidebar-logo-text,
    .sidebar-premium.collapsed .nav-section-label,
    .sidebar-premium.collapsed .nav-label,
    .sidebar-premium.collapsed .user-info {
        display: block;
    }
    
    .sidebar-premium.collapsed .nav-item {
        justify-content: flex-start;
        padding: 12px 14px;
        gap: 12px;
    }
    
    .sidebar-premium.collapsed .nav-badge {
        position: relative;
        top: auto;
        right: auto;
        padding: 3px 10px;
        font-size: 10px;
    }
    
    .sidebar-premium.collapsed .sidebar-user {
        flex-direction: row;
    }
    
    .sidebar-premium.collapsed .user-logout {
        width: 34px;
    }
    
    .sidebar-premium.collapsed .sidebar-collapse-btn svg {
        transform: none;
    }
    
    body.sidebar-mobile-open {
        overflow: hidden;
    }
}

@media (max-width: 480px) {
    .sidebar-premium {
        width: 100%;
        padding: 10px;
    }
    
    .sidebar-card {
        border-radius: 16px;
    }
}

/* ============================================================
   MAIN CONTENT ADJUSTMENTS
   ============================================================ */
.main-content {
    margin-left: 290px;
    width: calc(100% - 290px);
    min-width: 0;
    transition: margin-left 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.main-content.sidebar-collapsed {
    margin-left: 94px;
    width: calc(100% - 94px);
}

@media (max-width: 1024px) {
    .main-content,
    .main-content.sidebar-collapsed {
        margin-left: 0;
        width: 100%;
    }
}

/* Main Content (Legacy support) */
.main {
    flex: 1;
    margin-left: 290px;
    width: calc(100% - 290px);
    min-width: 0;
    min-height: calc(100vh - 68px);
    transition: margin-left 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-premium.collapsed ~ .main,
.main.sidebar-collapsed { 
    margin-left: 94px; 
    width: calc(100% - 94px);
}

@media (max-width: 1024px) {
    .main {
        margin-left: 0;
        width: 100%;
    }
    .sidebar-premium.collapsed ~ .main,
    .main.sidebar-collapsed { 
        margin-left: 0; 
        width: 100%;
    }
}

/* Topbar */
.topbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 68px;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(81,127,137,0.1);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 28px;
    z-index: 220;
}

/* ============================================================
   TOPBAR PREMIUM (Header ca în MedInsight)
   ============================================================ */

.topbar.topbar-premium {
    gap: 16px;
    justify-content: space-between;
}

.topbar-left,
.topbar-right {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
}

.provider-wrap {
    display: flex;
    align-items: center;
}

.topbar-center {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: stretch;
}

.topbar-hamburger {
    width: 42px;
    height: 42px;
}

.topbar-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--dark-text);
    padding: 8px 10px;
    border-radius: 12px;
}

.topbar-brand:hover {
    background: rgba(81,127,137,0.08);
}

.topbar-brand-icon {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(52,85,93,0.12), rgba(81,127,137,0.10));
    color: var(--accent);
}

.topbar-brand-text {
    font-weight: 700;
    font-size: 16px;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.icon-btn {
    position: relative;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--light-bg);
    border: none;
    border-radius: 12px;
    cursor: pointer;
    color: var(--violet-cenusiu);
}

.icon-btn:hover {
    background: rgba(81,127,137,0.12);
}

.icon-btn-sm {
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

.pill {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,0.9);
    border: 1px solid rgba(81,127,137,0.12);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.pill[role="button"] {
    cursor: pointer;
}

.pill:hover {
    border-color: rgba(81,127,137,0.22);
}

.pill-icon {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(189,220,219,0.65), rgba(208,219,219,0.55));
    color: var(--accent);
}

/* ============================================================
   TOPBAR - Stil "card" ca în sidebar (cerut: toate butoanele sus)
   ============================================================ */

.pill.pill-dark {
    background: linear-gradient(180deg,
        rgba(52, 85, 93, 0.92) 0%,
        rgba(81, 127, 137, 0.85) 100%);
    border: 1px solid rgba(189, 220, 219, 0.25);
    box-shadow:
        0 12px 40px rgba(52, 85, 93, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    color: white;
}

.pill.pill-dark .pill-title { color: white; font-weight: 800; }
.pill.pill-dark .pill-subtitle { color: rgba(255, 255, 255, 0.72); }

.pill.pill-dark .pill-icon {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.92);
}

.pill.pill-dark .caret { opacity: 0.85; }
.pill.pill-dark .user-avatar-pill {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.95);
}

.topbar-chip-btn {
    background: linear-gradient(180deg,
        rgba(52, 85, 93, 0.92) 0%,
        rgba(81, 127, 137, 0.85) 100%);
    border: 1px solid rgba(189, 220, 219, 0.25);
    box-shadow:
        0 12px 34px rgba(52, 85, 93, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.92);
}

.topbar-chip-btn:hover {
    background: linear-gradient(180deg,
        rgba(52, 85, 93, 0.96) 0%,
        rgba(81, 127, 137, 0.88) 100%);
}

/* Brand pill (Medicare PRO + Furnizor) */
.provider-pill {
    min-height: 0;
    padding: 12px 16px;
    gap: 12px;
    border-radius: 14px;
}

.provider-pill .pill-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.provider-pill .pill-subtitle {
    margin-top: 2px;
    color: rgba(255, 255, 255, 0.8);
}

.brand-pill-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.15);
    border: none;
    color: rgba(255, 255, 255, 0.95);
    flex-shrink: 0;
    overflow: hidden;
    line-height: 0; /* elimina orice offset de tip baseline */
    box-shadow: none;
}

.brand-pill-icon img {
    /*
      Important: multe logo-uri au "canvas" cu margini transparente,
      iar cu object-fit: cover pot parea "decalate" sau taiate.
      Pentru topbar vrem sa fie CENTRAT si complet vizibil.
    */
    width: 92%;
    height: 92%;
    display: block;
    /* Center + no crop */
    object-fit: contain;
    object-position: center center;
    padding: 0;
    border-radius: inherit;
    background: transparent;
}

/*
  Unele logo-uri (mai ales PNG) au "canvas" transparent decalatat.
  Pentru a le centra vizual in topbar, folosim un crop discret (cover)
  DOAR cand exista logo setat.
  Ajustarea fina se poate face din CSS vars daca e nevoie.
*/
.brand-pill-icon.has-logo img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 12px;
    margin: auto;
}

/* Când există logo setat, îl facem să arate „curat” pe fundalul topbar-ului */
.brand-pill-icon.has-logo {
    background: transparent;
    border: none;
    box-shadow: none;
}

.brand-pill-logo-preview {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    background: #ffffff;
    border: 1px solid rgba(214, 224, 228, 0.92);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 6px 16px rgba(16, 32, 40, 0.14);
}

.brand-pill-logo-preview img {
    max-width: 78%;
    max-height: 78%;
    object-fit: contain;
    border-radius: 12px;
    display: block;
}

.brand-pill .pill-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.brand-pro {
    display: inline-block;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(189,220,219,0.65), rgba(208,219,219,0.55));
    color: rgba(52, 85, 93, 0.95);
    letter-spacing: 1px;
}

.brand-sep {
    margin: 0 6px;
    opacity: 0.7;
}

.pill-text { line-height: 1.1; }
.pill-title { font-weight: 700; font-size: 14px; }
.pill-subtitle { font-size: 12px; color: var(--violet-cenusiu); margin-top: 3px; }
.provider-pill .pill-title {
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.datetime-pill { min-width: 120px; justify-content: center; }

.user-pill .caret { margin-left: 2px; opacity: 0.7; }
.user-avatar-pill {
    width: 34px;
    height: 34px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(52,85,93,0.18), rgba(81,127,137,0.14));
    color: var(--dark-text);
    font-weight: 700;
    font-size: 12px;
}


/* Dropdown anchoring */
.dropdown-wrap { position: relative; }
.dropdown-card.dropdown-left {
    right: auto;
    left: 0;
}
.provider-wrap .dropdown-card {
    top: 56px;
}
/* Dropdown cards (provider / user / help / notifications) */
.dropdown-card {
    position: absolute;
    top: 64px;
    right: 28px;
    width: 340px;
    background: rgba(255,255,255,0.98);
    border-radius: 14px;
    border: 1px solid rgba(81,127,137,0.14);
    box-shadow: 0 18px 60px rgba(0,0,0,0.14);
    z-index: 200;
    overflow: hidden;
}

.topbar-right { position: relative; }

/* ============================================================
   USER DROPDOWN — antet premium (avatar + nume + rol + email)
   ============================================================ */
.user-dropdown .user-dd-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 16px;
    background:
        linear-gradient(135deg, rgba(52,85,93,0.10), rgba(81,127,137,0.05) 58%, rgba(189,220,219,0.18));
    border-bottom: 1px solid rgba(81,127,137,0.14);
}

.user-dd-avatar {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.5px;
    box-shadow: 0 8px 20px rgba(52,85,93,0.28), inset 0 1px 0 rgba(255,255,255,0.25);
}

/* min-width:0 — fără el, ellipsis-ul nu se aplică într-un flex item */
.user-dd-meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.user-dd-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.user-dd-name {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    color: var(--dark-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-dd-role {
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    padding: 3px 9px;
    border-radius: 999px;
    color: var(--albastru-verzui-moderat);
    background: rgba(189,220,219,0.45);
    border: 1px solid rgba(81,127,137,0.22);
}

.user-dd-email {
    font-size: 12px;
    color: var(--violet-cenusiu);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-dropdown .user-dd-body { padding: 12px; }

.user-dd-actions {
    display: flex;
    gap: 10px;
}

.user-dd-btn {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    color: var(--albastru-verzui-moderat);
    background: rgba(208,219,219,0.42);
    border: 1px solid rgba(81,127,137,0.18);
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.user-dd-btn svg { flex: 0 0 auto; }

.user-dd-btn:hover {
    text-decoration: none;
    background: rgba(189,220,219,0.55);
    box-shadow: 0 8px 18px rgba(52,85,93,0.14);
    transform: translateY(-1px);
}

.user-dd-btn:active { transform: translateY(0); }

.user-dd-btn-danger {
    color: #B42318;
    background: rgba(231,76,60,0.10);
    border-color: rgba(231,76,60,0.22);
}

.user-dd-btn-danger:hover {
    background: rgba(231,76,60,0.16);
    box-shadow: 0 8px 18px rgba(231,76,60,0.18);
}

.dropdown-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(81,127,137,0.10);
    background: rgba(208,219,219,0.28);
}

.dropdown-header .link {
    font-size: 12px;
    text-decoration: none;
}

.dropdown-body { padding: 12px 14px; }

.dropdown-list { max-height: 320px; overflow-y: auto; }

.dropdown-item {
    display: flex;
    gap: 12px;
    padding: 12px 14px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid rgba(81,127,137,0.06);
}

.dropdown-item:hover { background: rgba(81,127,137,0.08); }

.dropdown-empty { padding: 28px 14px; text-align: center; color: var(--violet-cenusiu); }

.item-icon { font-size: 18px; }
.item-title { font-size: 13px; font-weight: 600; }
.item-sub { font-size: 11px; color: var(--violet-cenusiu); margin-top: 3px; }

.kv {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 8px 0;
    border-bottom: 1px dashed rgba(81,127,137,0.10);
}

.kv:last-child { border-bottom: none; }
.kv span:first-child { color: var(--violet-cenusiu); font-size: 12px; }
.kv span:last-child { font-weight: 600; font-size: 12px; text-align: right; }

.dropdown-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}

.muted { color: var(--violet-cenusiu); font-size: 12px; }

.search-box {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: var(--light-bg);
    border-radius: 12px;
    width: 100%;
    max-width: 100%;
    flex: 1 1 auto;
    min-width: 0;
}

.search-box input {
    flex: 1;
    min-width: 0;
    border: none;
    background: none;
    outline: none;
    font-size: 14px;
    font-family: inherit;
    color: var(--dark-text);
}

.topbar-actions { display: flex; align-items: center; gap: 10px; }

.notif-btn { position: relative; }

.notif-badge {
    position: absolute;
    top: 6px; right: 6px;
    width: 18px; height: 18px;
    background: var(--violet-roscat);
    border-radius: 50%;
    font-size: 10px;
    font-weight: 600;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Content */
.content { padding: 28px; animation: fadeIn 0.3s ease; }

/* Topbar Responsive (for mobile toggle button) */
@media (max-width: 1024px) {
    .topbar {
        padding-left: 76px;
    }
    
    .topbar.topbar-premium {
        padding-left: 76px;
    }
    
    .content {
        padding: 20px;
    }
}

@media (max-width: 480px) {
    .topbar {
        padding: 0 14px 0 70px;
    }
    
    .content {
        padding: 14px;
        width: 100%;
        max-width: 100vw;
    }
}

@media (max-width: 1024px) {
    .main, .main-content {
        width: 100% !important;
        max-width: 100vw;
    }
}

/* ============================================================
   PAGE COMPONENTS
   ============================================================ */

/* Page Header */
.page-header {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    margin-bottom: 28px;
    flex-wrap: wrap;
    gap: 16px;
}

.page-title { font-size: 26px; font-weight: 700; margin-bottom: 4px; }
.page-subtitle { font-size: 14px; color: var(--violet-cenusiu); }
.header-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* Stats Grid */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 18px;
    margin-bottom: 28px;
}

.stat-card {
    padding: 22px;
    background: white;
    border-radius: 16px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
    border-left: 4px solid var(--violet-inchis);
    transition: all 0.2s ease;
}

.stat-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.08); }

.stat-card.green { border-left-color: var(--verde-pal); }
.stat-card.yellow { border-left-color: var(--galben-verde); }
.stat-card.purple { border-left-color: var(--violet-roscat); }
.stat-card.blue { border-left-color: var(--info); }

.stat-icon {
    width: 50px; height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--light-bg);
    border-radius: 14px;
    color: var(--violet-inchis);
}

.stat-value { font-size: 26px; font-weight: 700; }
.stat-label { font-size: 13px; color: var(--violet-cenusiu); }

.stat-trend {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    background: rgba(39,174,96,0.15);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    color: var(--success);
    margin-left: auto;
}

.stat-trend.down { background: rgba(231,76,60,0.15); color: var(--danger); }

/* Cards */
.card {
    background: white;
    border-radius: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
    overflow: hidden;
    margin-bottom: 20px;
}

.card-header {
    padding: 18px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.1);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}

.card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 600;
}

.card-body { padding: 22px; }
.card-footer { padding: 16px 22px; border-top: 1px solid rgba(81,127,137,0.1); background: var(--light-bg); }

/* Quick Grid */
.quick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 18px;
}

.quick-card {
    background: white;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}

.quick-card-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 16px;
}

.quick-card-title { font-size: 14px; font-weight: 600; color: var(--violet-cenusiu); }

.quick-list { display: flex; flex-direction: column; gap: 10px; }

.quick-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    background: var(--light-bg);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.quick-item:hover { background: rgba(81,127,137,0.1); }

.quick-avatar {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--verde-pal), var(--galben-verde));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--violet-inchis);
    flex-shrink: 0;
}

.quick-info { flex: 1; min-width: 0; }
.quick-name { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quick-detail { font-size: 11px; color: var(--violet-cenusiu); }
.quick-time { font-size: 12px; font-weight: 600; color: var(--violet-inchis); flex-shrink: 0; }

/* Dashboard – Încasări (listă) */
.quick-item-pay { cursor: default; }
.quick-pay-link {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}
.quick-pay-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.btn-incaseaza { white-space: nowrap; }



/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

.btn:hover { transform: translateY(-1px); text-decoration: none; }
.btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

.btn-primary {
    background: linear-gradient(135deg, var(--violet-inchis), var(--violet-roscat));
    color: white;
    box-shadow: 0 4px 14px rgba(52,85,93,0.3);
}

.btn-primary:hover { box-shadow: 0 6px 20px rgba(52,85,93,0.4); }

.btn-secondary { background: var(--light-bg); color: var(--violet-inchis); }
.btn-secondary:hover { background: rgba(81,127,137,0.12); }

.btn-success { background: var(--success); color: white; }
.btn-danger { background: var(--danger); color: white; }
.btn-warning { background: var(--warning); color: white; }
.btn-info { background: var(--info); color: white; }

.btn-outline {
    background: transparent;
    border: 2px solid var(--violet-cenusiu);
    color: var(--violet-cenusiu);
}

.btn-outline:hover { border-color: var(--violet-roscat); color: var(--violet-roscat); }

.btn-sm { padding: 8px 14px; font-size: 13px; }
.btn-lg { padding: 16px 28px; font-size: 16px; }
.btn-icon { width: 38px; height: 38px; padding: 0; border-radius: 10px; }
.btn-block { width: 100%; }

/* ============================================================
   FORMS
   ============================================================ */
.form-group { margin-bottom: 20px; }

.form-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-text);
    margin-bottom: 8px;
}

.form-label .required { color: var(--danger); }

.form-control {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    font-family: inherit;
    color: var(--dark-text);
    background: var(--light-bg);
    border: 2px solid var(--light-bg);
    border-radius: 10px;
    outline: none;
    transition: all 0.2s ease;
}

.form-control:focus {
    border-color: var(--violet-roscat);
    background: white;
    box-shadow: 0 0 0 3px rgba(81,127,137,0.1);
}

.form-control.error { border-color: var(--danger); }

.form-control-icon {
    position: relative;
}

.form-control-icon .form-control { padding-left: 44px; }

.form-control-icon .icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--violet-cenusiu);
    pointer-events: none;
}

textarea.form-control {
    min-height: 100px;
    resize: vertical;
}

select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23517F89' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 40px;
}

.form-hint { font-size: 12px; color: var(--violet-cenusiu); margin-top: 6px; }
.form-error { font-size: 12px; color: var(--danger); margin-top: 6px; }

.form-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-row-3 { grid-template-columns: repeat(3, 1fr); }
.form-row-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 768px) {
    .form-row, .form-row-3, .form-row-4 { grid-template-columns: 1fr; }
}

.form-check {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.form-check input[type="checkbox"] {
    width: 18px; height: 18px;
    cursor: pointer;
    accent-color: var(--violet-roscat);
}

.form-check-label { font-size: 14px; cursor: pointer; }

/* ============================================================
   SERVICII - UI premium (Setări → Servicii)
   ============================================================ */

.mi-svc-layout{
    display: grid;
    grid-template-columns: 1.65fr 1fr;
    gap: 18px;
    align-items: start;
}

@media (max-width: 980px){
    .mi-svc-layout{ grid-template-columns: 1fr; }
}

.mi-svc-hero{
    display: flex;
    gap: 14px;
    align-items: center;
}

.mi-svc-hero-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background: linear-gradient(135deg, var(--violet-roscat), #06b6d4);
    color: #fff;
    box-shadow: 0 10px 24px rgba(66, 49, 68, 0.18);
}

.mi-svc-section{
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px dashed var(--border-soft);
}
.mi-svc-section:first-child{
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.mi-svc-section-title{
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.2px;
    color: var(--violet-inchis);
    margin-bottom: 12px;
}

.mi-inline-actions{
    display: flex;
    gap: 8px;
    align-items: center;
}

.mi-svc-side .alert{
    border-radius: 14px;
}

.mi-svc-preview{
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,1), rgba(243,244,246,0.35));
}

.mi-svc-preview-title{
    font-weight: 900;
    font-size: 16px;
    color: var(--text);
    margin-bottom: 8px;
}

.mi-svc-preview-badges{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.mi-svc-preview-stats{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.mi-svc-collapse{
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255,255,255,0.8);
}

/* ============================================================
   PERSONAL - UI premium (Asistente / Registratori)
   ============================================================ */

.mi-emp-layout{
    display: grid;
    grid-template-columns: 1.55fr 1fr;
    gap: 18px;
    align-items: start;
}

@media (max-width: 980px){
    .mi-emp-layout{ grid-template-columns: 1fr; }
    .mi-emp-side{ position: static; }
}

.mi-emp-side{
    position: sticky;
    top: 88px;
}

.mi-emp-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.mi-emp-hero{
    display: flex;
    gap: 14px;
    align-items: center;
}

.mi-emp-hero-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background: linear-gradient(135deg, #06b6d4, var(--violet-roscat));
    color: #fff;
    box-shadow: 0 10px 24px rgba(66, 49, 68, 0.18);
}

.mi-emp-hero-actions{
    display: flex;
    gap: 8px;
    align-items: center;
}

.mi-emp-section{
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px dashed var(--border-soft);
}

.mi-emp-section:first-child{
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.mi-emp-section-title{
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.2px;
    color: var(--violet-inchis);
    margin-bottom: 12px;
}

.mi-emp-preview{
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,1), rgba(243,244,246,0.35));
}

.mi-emp-preview-top{
    display: flex;
    gap: 12px;
    align-items: center;
}

.mi-emp-avatar{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(135deg, var(--violet-roscat), #06b6d4);
    color: #fff;
    box-shadow: 0 10px 22px rgba(66, 49, 68, 0.14);
    flex: 0 0 auto;
}

.mi-emp-preview-meta{ min-width: 0; }

.mi-emp-preview-name{
    font-weight: 900;
    font-size: 16px;
    color: var(--text);
    line-height: 1.2;
    word-break: break-word;
}

.mi-emp-preview-sub{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.mi-emp-preview-badges{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0;
}

.mi-emp-preview-stats{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.mi-stat{
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    padding: 10px;
    background: rgba(255,255,255,0.78);
}

.mi-stat-label{
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 4px;
}

.mi-stat-value{
    font-weight: 900;
    font-size: 16px;
    color: var(--text);
}

.mi-emp-preview-check{
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--border-soft);
}

.mi-emp-check-title{
    font-weight: 800;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 8px;
}

.mi-emp-check-list{ display: grid; gap: 6px; }

.mi-emp-check-item{
    font-size: 13px;
    color: var(--muted);
    padding-left: 2px;
}

.mi-emp-check-item.ok{
    color: #059669;
    font-weight: 800;
}

.mi-emp-check-item.bad{
    color: #b91c1c;
    font-weight: 800;
}


/* Modal generic (folosit la Categorii Servicii) */
.mi-modal{
    position: fixed;
    inset: 0;
    background: rgba(9, 18, 29, 0.58);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1500;
    padding: 18px;
}

.mi-modal.show{ display: flex; }

.mi-modal-content{
    background: var(--white);
    border-radius: 18px;
    width: min(1020px, 96vw);
    max-height: 90vh;
    overflow: auto;
    box-shadow: var(--shadow-strong);
    border: 1px solid var(--border-soft);
}

.mi-modal-header{
    padding: 16px 18px;
    border-bottom: 1px solid var(--border-soft);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.mi-modal-title{
    font-weight: 900;
    font-size: 16px;
    color: var(--text);
}

.mi-modal-sub{
    font-size: 12px;
    color: var(--violet-cenusiu);
    margin-top: 4px;
}

.mi-modal-body{ padding: 16px 18px 18px; }

.mi-modal-grid{
    display: grid;
    grid-template-columns: 1.05fr 1.4fr;
    gap: 16px;
}

@media (max-width: 980px){
    .mi-modal-grid{ grid-template-columns: 1fr; }
}

.mi-modal-pane{
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 14px;
    background: rgba(255,255,255,0.95);
}

.mi-modal-pane-title{
    font-weight: 900;
    font-size: 14px;
    color: var(--text);
    margin-bottom: 12px;
}

body.mi-modal-open{ overflow: hidden; }

/* ============================================================
   TABLES
   ============================================================ */
.table-container { overflow-x: auto; }

.table {
    width: 100%;
    border-collapse: collapse;
}

.table th {
    padding: 12px 16px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: var(--violet-cenusiu);
    background: var(--light-bg);
    white-space: nowrap;
    border-bottom: 1px solid rgba(81,127,137,0.1);
}

.table td {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(81,127,137,0.06);
    vertical-align: middle;
}

.table tr:last-child td { border-bottom: none; }
.table tr:hover td { background: rgba(81,127,137,0.03); }

.table-user { display: flex; align-items: center; gap: 12px; }

.table-avatar {
    width: 38px; height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--verde-pal), var(--galben-verde));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--violet-inchis);
    flex-shrink: 0;
}

.table-name { font-weight: 500; }
.table-sub { font-size: 12px; color: var(--violet-cenusiu); }
.table-actions { display: flex; gap: 6px; }

/* ============================================================
   BADGES
   ============================================================ */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}

.badge-success { background: rgba(39,174,96,0.12); color: var(--success); }
.badge-warning { background: rgba(243,156,18,0.12); color: var(--warning); }
.badge-danger { background: rgba(231,76,60,0.12); color: var(--danger); }
.badge-info { background: rgba(52,152,219,0.12); color: var(--info); }
.badge-primary { background: rgba(81,127,137,0.12); color: var(--violet-roscat); }
.badge-neutral { background: var(--light-bg); color: var(--violet-cenusiu); }

/* ============================================================
   MODAL
   ============================================================ */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
}

/* ============================================================
   MODAL LAYERS
   Keep document preview above other modals (ex: Decont)
   ============================================================ */
#decontModal{ z-index: 1200; }
#docPreviewModal{ z-index: 1400; }

.modal-overlay.active { opacity: 1; visibility: visible; }

.modal {
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    background: white;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    transform: scale(0.9);
    transition: transform 0.2s ease;
}

/* ============================================================
   MODAL - CONFLICT FIX (Bootstrap .modal etc.)
   Ensure our custom modals keep intended size/layout.
   ============================================================ */
.modal-overlay > .modal{
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    display: flex !important;
}
.modal-overlay.active > .modal{ transform: scale(1) !important; }

/* ============================================================
   CONSULTAȚIE - MODAL „Adaugă Serviciu” (compact + premium)
   ============================================================ */
#addServiceModal > .modal{
    width: min(640px, calc(100vw - 40px)) !important;
    max-width: 640px !important;
    max-height: 82vh !important;
    border-radius: 18px;
    box-shadow: 0 18px 55px rgba(0,0,0,0.22);
    overflow: hidden;
}
#addServiceModal .modal-header{ padding: 14px 18px; }
#addServiceModal .modal-body{ padding: 16px 18px; }
#addServiceModal .modal-footer{ padding: 12px 18px; }
#addServiceModal .form-label{ font-size: 12px; margin-bottom: 6px; }
#addServiceModal .form-control{ padding: 10px 12px; border-radius: 12px; }
#addServiceModal .mi-price-preview{ border-radius: 12px; padding: 10px 12px; }

.modal-overlay.active .modal { transform: scale(1); }

.modal-lg { max-width: 800px; }
.modal-xl { max-width: 1000px; }
.modal-sm { max-width: 400px; }

/* ============================================================
   CONSULTAȚIE - TRANSFER INTERN (Trimite la coleg)
   Compact & premium
   ============================================================ */
#internalTransferModal .modal-transfer{ max-width: 680px; }
#internalTransferModal .modal-header{ padding: 14px 18px; }
#internalTransferModal .modal-body{ padding: 16px; }
#internalTransferModal .alert{ padding: 10px 12px; font-size: 13px; margin-bottom: 12px; }
#internalTransferModal .form-label{ font-size: 12px; margin-bottom: 6px; }
#internalTransferModal .form-control{ padding: 10px 12px; }
#internalTransferModal textarea.form-control{ min-height: 84px; }
#internalTransferModal .mi-transfer-grid{ gap: 10px !important; }

#internalTransferModal .mi-segment{
    display:flex;
    gap:8px;
    background: var(--light-bg);
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    padding: 6px;
}
#internalTransferModal .mi-seg-item{ flex:1; cursor:pointer; user-select:none; }
#internalTransferModal .mi-seg-item input{ display:none; }
#internalTransferModal .mi-seg-item span{
    display:block;
    width:100%;
    text-align:center;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--violet-cenusiu);
}
#internalTransferModal .mi-seg-item input:checked + span{
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
    color: var(--violet-roscat);
}
#internalTransferModal .mi-seg-item:hover span{ background: rgba(81,127,137,0.12); }

.modal-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.1);
}

.modal-title { font-size: 17px; font-weight: 600; }

.modal-close {
    width: 34px; height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--light-bg);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    color: var(--violet-cenusiu);
}

.modal-close:hover { background: rgba(81,127,137,0.15); }

.modal-body { padding: 22px; overflow-y: auto; flex: 1; }

/* ============================================================
   CONSULTAȚIE - PREVIZUALIZARE PREȚ (în modalul de adăugare serviciu)
   ============================================================ */
.mi-price-preview{
    background: var(--light-bg);
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mi-price-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    color: var(--violet-cenusiu);
}
.mi-price-row strong{ color: var(--dark-text); font-weight: 700; }
.mi-price-total{
    margin-top: 2px;
    padding-top: 10px;
    border-top: 1px dashed rgba(81,127,137,0.25);
}
.mi-price-total strong{ font-size: 16px; }

.modal-footer {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 16px 22px;
    border-top: 1px solid rgba(81,127,137,0.1);
}

/* ============================================================
   TABS
   ============================================================ */
.tabs {
    display: flex;
    gap: 4px;
    padding: 4px;
    background: var(--light-bg);
    border-radius: 12px;
    margin-bottom: 20px;
    /* `width: fit-content` + nowrap făcea ca, la multe categorii (12 în Servicii),
       tab-urile să iasă din container fără scrollbar — ultimele erau inaccesibile
       pe desktop. Le lăsăm să treacă pe rândul următor. */
    max-width: 100%;
    flex-wrap: wrap;
}

.tab {
    padding: 9px 18px;
    background: none;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    font-family: inherit;
    color: var(--violet-cenusiu);
    transition: all 0.2s ease;
    text-decoration: none;
}

.tab:hover { color: var(--violet-inchis); text-decoration: none; }

.tab.active {
    background: white;
    color: var(--violet-inchis);
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

/* ============================================================
   FILTERS
   ============================================================ */
.filters {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    padding: 16px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.filter-group { display: flex; align-items: center; gap: 8px; }
.filter-label { font-size: 13px; font-weight: 500; color: var(--violet-cenusiu); }

.filter-select {
    padding: 8px 12px;
    font-size: 13px;
    font-family: inherit;
    border: 1px solid rgba(81,127,137,0.2);
    border-radius: 8px;
    background: white;
    cursor: pointer;
}

/* ============================================================
   CALENDAR
   ============================================================ */
.calendar-layout {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 20px;
}

@media (max-width: 1000px) {
    .calendar-layout { grid-template-columns: 1fr; }
}

.mini-calendar {
    background: white;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}

.calendar-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 16px;
}

.calendar-nav-btn {
    width: 32px; height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--light-bg);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: var(--violet-cenusiu);
}

.calendar-nav-btn:hover { background: rgba(81,127,137,0.15); }

.calendar-month { font-size: 15px; font-weight: 600; text-transform: capitalize; }

.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 6px;
}

.calendar-weekday {
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    color: var(--violet-cenusiu);
    padding: 6px;
}

.calendar-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.calendar-day {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-size: 13px;
    font-family: inherit;
    color: var(--dark-text);
    position: relative;
    transition: all 0.2s ease;
}

.calendar-day:hover:not(:disabled) { background: var(--light-bg); }
.calendar-day.selected { background: linear-gradient(135deg, var(--violet-inchis), var(--violet-roscat)); color: white; }
.calendar-day.today:not(.selected) { background: var(--light-bg); font-weight: 700; }
.calendar-day:disabled { visibility: hidden; }
.calendar-day.other-month { color: var(--violet-cenusiu); opacity: 0.5; }

.calendar-day-dot {
    position: absolute;
    bottom: 4px;
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--verde-pal);
}

.calendar-day.selected .calendar-day-dot { background: white; }

/* Day Schedule */
.day-schedule {
    background: white;
    border-radius: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
    overflow: hidden;
}

.day-schedule-header {
    padding: 18px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.1);
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.day-schedule-title { font-size: 17px; font-weight: 600; text-transform: capitalize; }

.time-slots { padding: 16px; max-height: 580px; overflow-y: auto; }

.time-slot {
    display: flex;
    gap: 14px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(81,127,137,0.05);
}

.time-slot:last-child { border-bottom: none; }

.time-slot-label {
    min-width: 50px;
    font-size: 13px;
    font-weight: 600;
    color: var(--violet-cenusiu);
    padding-top: 10px;
}

.time-slot-content { flex: 1; min-height: 48px; }

.slot-empty {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 12px 14px;
    background: var(--light-bg);
    border: 2px dashed rgba(81,127,137,0.2);
    border-radius: 10px;
    cursor: pointer;
    font-size: 13px;
    color: var(--violet-cenusiu);
    transition: all 0.2s ease;
}

.slot-empty:hover { border-color: var(--violet-roscat); background: rgba(81,127,137,0.05); }

.slot-booked {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.slot-booked:hover { transform: scale(1.02); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

.slot-booked.confirmed { background: var(--verde-pal); color: white; }
.slot-booked.pending { background: var(--galben-verde); color: var(--violet-inchis); }
.slot-booked.cancelled { background: rgba(231,76,60,0.3); }

.slot-info { flex: 1; }
.slot-patient { font-size: 13px; font-weight: 600; }
.slot-service { font-size: 11px; opacity: 0.8; }

.slot-actions { display: flex; gap: 4px; }

.slot-action {
    width: 26px; height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.5);
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

.slot-action:hover { background: rgba(255,255,255,0.8); }

/* ============================================================
   SERVICES GRID
   ============================================================ */
.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.service-card {
    padding: 20px;
    background: white;
    border-radius: 14px;
    border: 2px solid transparent;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
    cursor: pointer;
    transition: all 0.2s ease;
}

.service-card:hover { border-color: var(--violet-roscat); transform: translateY(-3px); }

/* Servicii inactive: rămân în listă, dar sunt marcate vizual */
.service-card.is-inactive {
    opacity: 0.72;
    border: 2px dashed rgba(81,127,137,0.35);
    box-shadow: none;
}

.service-card.is-inactive:hover {
    border-color: rgba(81,127,137,0.35);
    transform: none;
}

.service-card.is-inactive .service-price { color: var(--violet-cenusiu); }

.service-icon {
    width: 46px; height: 46px;
    padding: 11px;
    background: linear-gradient(135deg, rgba(189,220,219,0.2), rgba(208,219,219,0.2));
    border-radius: 12px;
    color: var(--violet-inchis);
    margin-bottom: 14px;
}

.service-name { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.service-desc { font-size: 12px; color: var(--violet-cenusiu); margin-bottom: 12px; line-height: 1.5; }

.service-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid var(--light-bg);
}

.service-price { font-size: 17px; font-weight: 700; color: var(--violet-inchis); }
.service-duration { font-size: 12px; color: var(--violet-cenusiu); display: flex; align-items: center; gap: 4px; }

/* ============================================================
   PROFILE
   ============================================================ */
.profile-card {
    display: flex;
    gap: 20px;
    padding: 20px;
    background: var(--light-bg);
    border-radius: 14px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.profile-avatar {
    width: 100px; height: 100px;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--verde-pal), var(--galben-verde));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    font-weight: 700;
    color: var(--violet-inchis);
    flex-shrink: 0;
}

.profile-info { flex: 1; min-width: 200px; }
.profile-name { font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.profile-subtitle { font-size: 14px; color: var(--violet-cenusiu); margin-bottom: 14px; }

.profile-details { display: flex; flex-wrap: wrap; gap: 16px; }

.profile-detail {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--violet-cenusiu);
}

/* ============================================================
   ALERTS
   ============================================================ */
.alert {
    padding: 14px 18px;
    border-radius: 12px;
    margin-bottom: 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: rgba(255,255,255,0.86);
    border: 1px solid rgba(17,24,39,0.08);
    box-shadow: 0 10px 26px rgba(17,24,39,0.06);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-left: 5px solid rgba(17,24,39,0.12);
    color: var(--text);
}

/* Fără fundaluri colorate (doar accent pe stânga) */
.alert-success { border-left-color: rgba(39,174,96,0.95); }
.alert-danger  { border-left-color: rgba(231,76,60,0.95); }
.alert-warning { border-left-color: rgba(245,158,11,0.95); }
.alert-info    { border-left-color: rgba(52,152,219,0.95); }

.alert-icon { flex-shrink: 0; }
.alert-content { flex: 1; }
.alert-title { font-weight: 700; margin-bottom: 2px; }
.alert-message { font-size: 13px; color: var(--violet-cenusiu); }

/* ============================================================
   PAGINATION
   ============================================================ */
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
}

.pagination-btn {
    min-width: 36px; height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    background: white;
    border: 1px solid rgba(81,127,137,0.2);
    border-radius: 8px;
    font-size: 13px;
    font-family: inherit;
    color: var(--violet-cenusiu);
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

.pagination-btn:hover { border-color: var(--violet-roscat); color: var(--violet-roscat); text-decoration: none; }

.pagination-btn.active {
    background: var(--violet-roscat);
    border-color: var(--violet-roscat);
    color: white;
}

.pagination-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty-state {
    text-align: center;
    padding: 60px 20px;
}

.empty-state-icon {
    width: 80px; height: 80px;
    margin: 0 auto 20px;
    padding: 20px;
    background: var(--light-bg);
    border-radius: 20px;
    color: var(--violet-cenusiu);
}

.empty-state h3 { font-size: 18px; margin-bottom: 8px; }
.empty-state p { font-size: 14px; color: var(--violet-cenusiu); margin-bottom: 20px; }

/* ============================================================
   UTILITIES
   ============================================================ */
.text-muted { color: var(--violet-cenusiu); }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }
.text-center { text-align: center; }
.text-right { text-align: right; }

.mb-0 { margin-bottom: 0 !important; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-20 { margin-bottom: 20px; }
.mb-24 { margin-bottom: 24px; }
.mt-16 { margin-top: 16px; }
.mt-20 { margin-top: 20px; }

.d-flex { display: flex; }
.align-center { align-items: center; }
.justify-between { justify-content: flex-end; }
.gap-8 { gap: 8px; }
.gap-16 { gap: 16px; }
.flex-wrap { flex-wrap: wrap; }

.w-100 { width: 100%; }
.hidden { display: none !important; }

/* ============================================================
   LOADING
   ============================================================ */
.loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.spinner {
    width: 32px; height: 32px;
    border: 3px solid var(--light-bg);
    border-top-color: var(--violet-roscat);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.btn .spinner { width: 18px; height: 18px; border-width: 2px; }

/* ============================================================
   PREMIUM COLOR OVERRIDES
   ============================================================ */

/* Surfețe “glass” (mai puțin alb/deranjant, dar rămâne luminos) */
.sidebar,
.topbar,
.card,
.quick-card,
.stat-card,
.filters,
.mini-calendar,
.day-schedule,
.service-card,
.modal,
.pagination-btn {
    background: var(--surface-strong);
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
}

/* Ușor translucide unde e ok să “prindă” fundalul */
.topbar,
.sidebar {
    background: var(--surface);
    backdrop-filter: blur(12px);
}

.sidebar {
    border-right: 1px solid var(--border-soft);
}

.card,
.quick-card,
.stat-card,
.mini-calendar,
.day-schedule,
.service-card,
.filters {
    border-radius: 18px;
}

/* Butoane/zone neutre - mai “soft” */
.search-box,
.notif-btn,
.toggle-btn,
.user-card,
.card-footer,
.tabs,
.modal-close,
.calendar-nav-btn,
.slot-empty,
.empty-state-icon {
    background: var(--surface-soft);
}

/* Table head mai cald */
.table th {
    background: rgba(81,127,137, 0.06);
}

/* Hover-uri mai vizibile (dar discrete) */
.nav-item:hover,
.quick-item:hover,
table tbody tr:hover td,
.table tr:hover td {
    background: rgba(81,127,137, 0.06);
}

/* Cardurile stats: accent mai viu */
.stat-card {
    border-left-width: 5px;
}

/* Form controls: fundal mai plăcut + focus mai “premium” */
.form-control {
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(81,127,137, 0.10);
}

.form-control:focus {
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0 0 4px rgba(81,127,137, 0.10);
}

/* Buton primary: puțin mai “luminos” */
.btn-primary {
    box-shadow: var(--shadow-strong);
}

/* Calendar: hover & azi mai evidente */
.calendar-day:hover:not(:disabled) {
    background: rgba(81,127,137, 0.07);
}

.calendar-day.today:not(.selected) {
    background: rgba(189,220,219, 0.18);
}

/* Slot booked pending: să nu pară “murdar”, ci warm */
.slot-booked.pending {
    background: rgba(243, 156, 18, 0.26);
    color: var(--violet-inchis);
}

/* Separatoare mai fine */
.card-header,
.card-footer,
.modal-header,
.modal-footer,
.day-schedule-header,
.sidebar-header,
.sidebar-footer {
    border-color: rgba(81,127,137, 0.10);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 768px) {
    .sidebar { width: 76px; }
    .sidebar .section-label,
    .sidebar .nav-item span,
    .sidebar .user-info,
    .sidebar .logout-btn span { display: none; }
    
    .main { margin-left: 76px; }
    
    .content { padding: 16px; }
    
    .page-header { flex-direction: column; align-items: flex-start; }
    
    .search-box { width: 100%; max-width: 250px; }
    
    .topbar { padding: 0 16px; }
}

/* ============================================================
   PAYMENT SLOTS CONFIGURATION
   ============================================================ */
.form-section {
    background: var(--surface-soft);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid var(--border-soft);
}

.payment-slots-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.payment-slot-item {
    background: var(--white);
    border-radius: 10px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.payment-slot-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
}

.payment-slot-header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.payment-slot-badge {
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.payment-slot-name {
    font-size: 13px;
    font-weight: 500;
    color: var(--dark-text);
}

.payment-slot-input {
    display: flex;
    align-items: center;
    gap: 8px;
}

.payment-slot-input select {
    flex: 1;
}

.form-control-sm {
    padding: 6px 10px;
    font-size: 13px;
}

/* Slot Duration Badge in Lists */
.slot-duration-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 12px;
    background: var(--surface-soft);
    color: var(--violet-cenusiu);
}

.slot-duration-badge svg {
    width: 12px;
    height: 12px;
}

/* Slot Selector in Appointment Form */
.slot-selector {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 8px;
    max-height: 300px;
    overflow-y: auto;
    padding: 12px;
    background: var(--light-bg);
    border-radius: 10px;
    border: 1px solid var(--border-soft);
}


/* Time inputs locked: value is filled only after selecting a slot */
.time-locked {
    pointer-events: none;
    background: rgba(0, 0, 0, 0.035);
    border-style: dashed;
    border-color: rgba(0, 0, 0, 0.18);
    cursor: not-allowed;
}

.slot-btn {
    padding: 10px 8px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: var(--white);
    color: var(--dark-text);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: center;
}

.slot-btn:hover:not(.slot-btn-booked):not(.slot-btn-past):not(.slot-btn-blocked) {
    background: var(--verde-pal);
    color: var(--white);
    border-color: var(--verde-pal);
    transform: scale(1.02);
}

.slot-btn.slot-btn-selected {
    background: var(--verde-pal);
    color: var(--white);
    border-color: var(--verde-pal);
    box-shadow: 0 2px 8px rgba(81, 127, 137, 0.3);
}

.slot-btn.slot-btn-booked {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
    cursor: not-allowed;
    text-decoration: line-through;
    opacity: 0.7;
}

.slot-btn.slot-btn-past {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #9ca3af;
    cursor: not-allowed;
}

.slot-btn.slot-btn-blocked {
    background: #fff7ed;
    border-color: #fdba74;
    color: #c2410c;
    cursor: not-allowed;
    opacity: 0.85;
}

.slot-duration-info {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: linear-gradient(135deg, var(--verde-pal)10, var(--verde-foarte-deschis)30);
    border-radius: 10px;
    margin-bottom: 12px;
    font-size: 14px;
}

.slot-duration-info strong {
    color: var(--verde-pal);
}

/* Payment Type Pills in Appointment Form */
.payment-type-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.payment-type-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 2px solid var(--border-soft);
    border-radius: 20px;
    background: var(--white);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.payment-type-pill:hover {
    border-color: var(--verde-pal);
    background: var(--verde-foarte-deschis)20;
}

.payment-type-pill.active {
    border-color: var(--verde-pal);
    background: var(--verde-pal);
    color: var(--white);
}

.payment-type-pill .pill-duration {
    font-size: 11px;
    opacity: 0.8;
    padding: 2px 6px;
    background: rgba(255,255,255,0.2);
    border-radius: 10px;
}

@media (max-width: 768px) {
    .payment-slots-grid {
        grid-template-columns: 1fr;
    }
    
    .slot-selector {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ============================================================
   CABINET CONSULTAȚII - PREMIUM INTERFACE
   ============================================================ */

/* Layout principal */
.consultation-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 20px;
}


.consultation-layout.no-sidebar {
    grid-template-columns: 1fr;
}

.consultation-main {
    min-width: 0;
}

.consultation-sidebar {
    min-width: 0;
}

/* Header consultație */
.consultation-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    padding: 20px;
    background: var(--surface-strong);
    border-radius: 16px;
    margin-bottom: 20px;
    box-shadow: var(--shadow-soft);
}

.consultation-header-left {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.consultation-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.consultation-title {
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    color: var(--violet-inchis);
}

.consultation-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: var(--violet-cenusiu);
}

.consultation-meta code {
    background: var(--light-bg);
    padding: 2px 8px;
    border-radius: 4px;
    font-family: monospace;
    font-weight: 600;
    color: var(--verde-pal);
}

.consultation-header-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Grid consultație */
.consultation-grid {
    display: grid;
    grid-template-columns: 320px 1fr 380px;
    gap: 20px;
    align-items: start;
}

.consultation-col {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.consultation-col.h-100 > .card {
    flex: 1;
}

/* Card pacient */
.consultation-patient-card .card-body {
    text-align: center;
    padding: 24px;
}

.patient-avatar-large {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--verde-pal), var(--galben-verde));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 700;
    color: white;
    margin: 0 auto 16px;
    box-shadow: 0 4px 12px rgba(81, 127, 137, 0.3);
}

.patient-name {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 16px;
}

.patient-details {
    text-align: left;
    background: var(--light-bg);
    border-radius: 12px;
    padding: 16px;
}

.detail-row {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid var(--border-soft);
    font-size: 13px;
}

.detail-row:last-child {
    border-bottom: none;
}

.detail-label {
    color: var(--violet-cenusiu);
}

.detail-value {
    font-weight: 500;
}

/* Alergii */
.patient-allergies {
    margin-top: 16px;
    padding: 12px;
    background: #fff3cd;
    border-radius: 10px;
    border: 1px solid #ffc107;
}

.patient-allergies h4 {
    font-size: 13px;
    margin-bottom: 8px;
    color: #856404;
}

.allergy-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.allergy-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.allergy-badge.allergy-severe {
    background: #f8d7da;
    color: #721c24;
}

.allergy-badge.allergy-moderate {
    background: #fff3cd;
    color: #856404;
}

.allergy-badge.allergy-mild {
    background: #d1e7dd;
    color: #0f5132;
}

/* Acțiuni rapide */
.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.quick-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 14px 10px;
    background: var(--light-bg);
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    color: var(--dark-text);
}

.quick-action-btn:hover {
    background: var(--verde-foarte-deschis)40;
    border-color: var(--verde-pal);
    transform: translateY(-2px);
    text-decoration: none;
}

.quick-action-icon {
    font-size: 24px;
}

.quick-action-label {
    font-size: 12px;
    font-weight: 500;
    text-align: center;
}

/* Lista servicii */
.services-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.service-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--light-bg);
    border-radius: 10px;
    border: 1px solid var(--border-soft);
}

.service-info {
    flex: 1;
    min-width: 0;
}

.service-name {
    font-weight: 500;
    font-size: 14px;
}

.service-meta {
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.service-notes {
    font-style: italic;
}

.service-price {
    font-weight: 600;
    color: var(--verde-pal);
    white-space: nowrap;
}

.empty-services {
    padding: 24px;
    text-align: center;
}

/* Total servicii */
.services-total {
    background: var(--light-bg);
}

.total-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 14px;
}

.total-row.total-grand {
    padding-top: 12px;
    margin-top: 8px;
    border-top: 2px solid var(--verde-pal);
    font-size: 18px;
    font-weight: 700;
    color: var(--verde-pal);
}

/* Lista de așteptare */
.waiting-list {
    display: flex;
    flex-direction: column;
}

.waiting-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-soft);
    transition: background 0.2s ease;
}

.waiting-item:hover {
    background: rgba(81, 127, 137, 0.04);
}

.waiting-item:last-child {
    border-bottom: none;
}

.waiting-item-active {
    background: rgba(0, 123, 255, 0.08);
    border-left: 4px solid #007bff;
}

.waiting-item.priority-vip {
    border-left: 4px solid #ffc107;
}

.waiting-item.priority-urgent {
    border-left: 4px solid #dc3545;
}

.waiting-item-main {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.waiting-item-time {
    min-width: 60px;
    text-align: center;
}

.time-scheduled {
    font-size: 18px;
    font-weight: 700;
    color: var(--violet-inchis);
}

.time-wait {
    font-size: 11px;
    color: var(--violet-cenusiu);
    margin-top: 4px;
}

.waiting-item-patient {
    flex: 1;
    min-width: 0;
}

.patient-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.patient-meta {
    font-size: 13px;
    color: var(--violet-cenusiu);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.patient-assistant-row {
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.patient-assistant-row .assistant-label {
    opacity: 0.85;
    font-weight: 600;
}

.patient-assistant-row select {
    padding: 6px 10px;
    border-radius: 10px;
    border: 1px solid var(--border-soft);
    background: white;
    font-size: 12px;
    min-width: 220px;
}

.patient-service {
    margin-top: 6px;
    font-size: 13px;
}

.patient-complaints {
    margin-top: 6px;
    padding: 6px 10px;
    background: var(--light-bg);
    border-radius: 6px;
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.waiting-item-doctor {
    flex-shrink: 0;
}

.doctor-badge {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

.waiting-item-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding-top: 8px;
    border-top: 1px dashed var(--border-soft);
}

/* Priority badges */
.priority-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

.priority-badge.priority-vip {
    background: #fff3cd;
    color: #856404;
}

.priority-badge.priority-urgent {
    background: #f8d7da;
    color: #721c24;
}

/* Lista plăți */
.payment-list {
    display: flex;
    flex-direction: column;
}

.payment-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-soft);
}

.payment-item:last-child {
    border-bottom: none;
}

.payment-item-paid {
    background: rgba(40, 167, 69, 0.08);
}

.payment-info {
    flex: 1;
    min-width: 0;
}

.payment-patient {
    font-weight: 500;
    font-size: 14px;
}

.payment-meta {
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.payment-amount {
    text-align: right;
}

.amount-value {
    font-size: 16px;
    font-weight: 600;
}

/* Doctor info compact */
.doctor-info-compact {
    text-align: center;
}

/* Document types grid */
.document-types-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.document-type-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 20px 12px;
    background: var(--light-bg);
    border: 2px solid var(--border-soft);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.document-type-btn:hover {
    border-color: var(--verde-pal);
    background: var(--verde-foarte-deschis)20;
    transform: translateY(-2px);
}

.doc-icon {
    font-size: 28px;
}

.doc-label {
    font-size: 12px;
    font-weight: 500;
    text-align: center;
}

/* Medical history modal */
.history-section {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-soft);
}

.history-section:last-child {
    border-bottom: none;
}

.history-section h4 {
    margin-bottom: 12px;
    color: var(--violet-inchis);
}

.history-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.history-list li {
    padding: 8px 12px;
    background: var(--light-bg);
    border-radius: 6px;
    margin-bottom: 6px;
    font-size: 14px;
}

.history-stats {
    display: flex;
    gap: 20px;
    padding: 16px;
    background: var(--light-bg);
    border-radius: 12px;
}

.stat-mini {
    text-align: center;
}

.stat-mini strong {
    display: block;
    font-size: 20px;
    color: var(--verde-pal);
}

/* Consultations timeline */
.consultations-timeline {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.timeline-item {
    display: flex;
    gap: 16px;
    padding: 12px;
    background: var(--light-bg);
    border-radius: 10px;
    border-left: 3px solid var(--verde-pal);
}

.timeline-date {
    min-width: 100px;
    text-align: center;
}

.timeline-date strong {
    display: block;
}

.timeline-date span {
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.timeline-content {
    flex: 1;
    font-size: 14px;
}

.timeline-service {
    font-weight: 500;
    margin-bottom: 6px;
}

.timeline-diagnosis,
.timeline-prescription {
    font-size: 13px;
    color: var(--violet-cenusiu);
    margin-top: 4px;
}

/* History item compact */
.history-item-compact {
    padding: 10px;
    background: var(--light-bg);
    border-radius: 8px;
    margin-bottom: 8px;
    font-size: 14px;
}

/* Loading spinner */
.loading-spinner {
    text-align: center;
    padding: 40px;
    color: var(--violet-cenusiu);
}

/* Modal large */
.modal-large {
    max-width: 900px;
}

/* Form actions */
.form-actions {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--border-soft);
}

/* Button block */
.btn-block {
    width: 100%;
}

/* Button large */
.btn-lg {
    padding: 14px 24px;
    font-size: 16px;
}

/* Text utilities */
.text-success {
    color: #28a745 !important;
}

/* Responsive */
@media (max-width: 1400px) {
    .consultation-grid {
        grid-template-columns: 280px 1fr 340px;
    }
}

@media (max-width: 1200px) {
    .consultation-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .consultation-col-patient {
        order: 1;
    }
    
    .consultation-col-services {
        order: 2;
    }
    
    .consultation-col-notes {
        order: 3;
        grid-column: 1 / -1;
    }
    
    .consultation-layout {
        grid-template-columns: 1fr;
    }
    
    .consultation-sidebar {
        order: -1;
    }
}

@media (max-width: 768px) {
    .consultation-grid {
        grid-template-columns: 1fr;
    }
    
    .consultation-header {
        flex-direction: column;
    }
    
    .consultation-header-right {
        flex-wrap: wrap;
    }
    
    .quick-actions-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .document-types-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .waiting-item-main {
        flex-direction: column;
    }
    
    .waiting-item-time {
        text-align: left;
    }
}

/* ============================================================
   CONSULTATION TABS - Premium Interface
   ============================================================ */

/* Header Premium */
.consultation-header-premium {
    background: linear-gradient(135deg, var(--verde-albastrui-moderat) 0%, var(--albastru-verzui-moderat) 100%);
    color: white;
    padding: 16px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 12px 12px 0 0;
    margin: -20px -20px 0 -20px;
}

.consultation-header-premium .patient-header-info {
    display: flex;
    align-items: center;
    gap: 16px;
}

.consultation-header-premium .patient-avatar-header {
    width: 48px;
    height: 48px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 600;
}

.consultation-header-premium .patient-header-details h2 {
    font-size: 1.2rem;
    margin-bottom: 2px;
    font-weight: 600;
}

.consultation-header-premium .patient-header-details span {
    opacity: 0.9;
    font-size: 0.85rem;
}

.consultation-header-premium .btn-light {
    background: rgba(255,255,255,0.15);
    color: white;
    border: 1px solid rgba(255,255,255,0.3);
    margin-right: 16px;
}

.consultation-header-premium .btn-light:hover {
    background: rgba(255,255,255,0.25);
}

.consultation-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-badge {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.badge-reg {
    background: rgba(255,255,255,0.2);
    font-family: monospace;
}

/* Tabs Container */
.consultation-tabs-container {
    background: #f8f9fa;
    border-bottom: 1px solid var(--border-soft);
    margin: 0 -20px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.consultation-tabs {
    display: flex;
    gap: 4px;
    flex: 1 1 auto;
}

.consultation-tabs-actions {
    display: flex;
    align-items: center;
    padding: 8px 0;
}

.btn-finish-consultation {
    box-shadow: 0 6px 18px rgba(40,167,69,0.22);
}

.btn-finish-consultation:hover {
    box-shadow: 0 10px 26px rgba(40,167,69,0.30);
}

.consultation-tab {
    padding: 14px 24px;
    cursor: pointer;
    border: none;
    background: none;
    font-size: 0.95rem;
    color: var(--violet-cenusiu);
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 3px solid transparent;
    transition: all 0.2s;
    position: relative;
}

.consultation-tab:hover {
    color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.05);
}

.consultation-tab.active {
    color: var(--verde-albastrui-moderat);
    border-bottom-color: var(--verde-albastrui-moderat);
    font-weight: 600;
}

.consultation-tab i {
    font-size: 1rem;
}

.consultation-tab .tab-badge {
    background: var(--verde-albastrui-moderat);
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 500;
}

.consultation-tab.active .tab-badge {
    background: var(--albastru-verzui-moderat);
}

/* Tab Content */
.consultation-tab-contents {
    padding-top: 20px;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
    animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Patient Tab Layout */
.patient-tab-layout {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.patient-row-two {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
}

@media (max-width: 1400px) {
    .patient-row-two {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 1100px) {
    .patient-row-two {
        grid-template-columns: 1fr;
    }
}

/* ------------------------------------------------------------
   Premium patient summary (condensat)
------------------------------------------------------------- */
.patient-premium-card { width: 100%; }

.patient-premium-top {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.patient-avatar-mini {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: rgba(81, 127, 137, 0.18);
    border: 1px solid rgba(81, 127, 137, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: var(--verde-albastrui-moderat);
    letter-spacing: 0.5px;
}

.patient-premium-main { flex: 1; min-width: 0; }

.patient-premium-name {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--dark-text);
    line-height: 1.2;
}

.patient-premium-sub {
    margin-top: 2px;
    font-size: 0.86rem;
    color: var(--violet-cenusiu);
}

.patient-premium-chips {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chip {
    --chip: var(--verde-albastrui-moderat);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--chip) 30%, transparent);
    background: color-mix(in srgb, var(--chip) 10%, #fff);
    color: color-mix(in srgb, var(--chip) 85%, #000);
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
}

.patient-premium-stats {
    display: flex;
    gap: 10px;
}

.patient-premium-stats .stat {
    min-width: 84px;
    padding: 10px 10px;
    border-radius: 14px;
    border: 1px solid var(--border-soft);
    background: rgba(0,0,0,0.02);
    text-align: center;
}

.patient-premium-stats .stat .v {
    font-size: 0.95rem;
    font-weight: 900;
    color: var(--dark-text);
}

.patient-premium-stats .stat .k {
    margin-top: 2px;
    font-size: 0.72rem;
    color: var(--violet-cenusiu);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.patient-premium-contacts {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--border-soft);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
}

.patient-premium-contacts .contact {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--dark-text);
    font-size: 0.9rem;
}

.patient-premium-contacts .contact .ico {
    opacity: 0.75;
}

.patient-premium-contacts .contact.full { grid-column: 1 / -1; }

.patient-allergies-inline {
    margin-top: 12px;
    padding: 10px;
    background: #fff8e1;
    border: 1px solid #ffe69c;
    border-radius: 12px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.patient-allergies-inline .allergy-title {
    font-weight: 800;
    color: #856404;
    white-space: nowrap;
}

.patient-more-toggle {
    margin-top: 12px;
    width: 100%;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px dashed var(--border-soft);
    background: transparent;
    color: var(--verde-albastrui-moderat);
    font-weight: 800;
    cursor: pointer;
}

.patient-more-toggle:hover {
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.06);
}

.patient-more-box {
    margin-top: 10px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid var(--border-soft);
    background: var(--light-bg);
}

.patient-details-grid.compact {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.patient-details-grid.compact .detail-label { font-size: 0.75rem; }
.patient-details-grid.compact .detail-value { font-size: 0.9rem; }

.patient-info-column .patient-avatar-large {
    width: 80px;
    height: 80px;
    margin: 0 auto 16px;
    font-size: 28px;
}

.patient-name-large {
    text-align: center;
    font-size: 1.3rem;
    margin-bottom: 20px;
    color: var(--dark-text);
}

.patient-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.patient-details-grid .detail-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.patient-details-grid .detail-item.full-width {
    grid-column: 1 / -1;
}

.patient-details-grid .detail-label {
    font-size: 0.8rem;
    color: var(--violet-cenusiu);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.patient-details-grid .detail-value {
    font-size: 0.95rem;
    color: var(--dark-text);
}

.patient-allergies-box {
    margin-top: 20px;
    padding: 16px;
    background: #fff3cd;
    border-radius: 8px;
    border-left: 4px solid #ffc107;
}

.patient-allergies-box h4 {
    margin-bottom: 10px;
    font-size: 0.95rem;
    color: #856404;
}

/* Quick Actions Grid */
.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.quick-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px;
    background: var(--light-bg);
    border: 2px solid var(--border-soft);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    color: var(--dark-text);
}

.quick-action-btn:hover {
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.1);
    transform: translateY(-2px);
}

.quick-action-btn i {
    font-size: 1.5rem;
    color: var(--verde-albastrui-moderat);
}

.quick-action-btn span {
    font-size: 0.85rem;
    text-align: center;
}

/* Doctor Info Box */
.doctor-info-box,
.consultation-info-box {
    text-align: center;
}

.consultation-info-box .info-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-soft);
}

.consultation-info-box .info-row:last-child {
    border-bottom: none;
}

/* Notes Tab Layout */
.notes-tab-layout {
    max-width: 900px;
}

.notes-tab-layout .form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 16px;
}

.notes-tab-layout .form-group {
    flex: 1;
}

.notes-tab-layout .form-group.col-12 {
    flex: 0 0 100%;
}

.notes-tab-layout .form-group.col-6 {
    flex: 0 0 calc(50% - 10px);
}

/* Services Tab Layout */
.services-tab-layout {
    max-width: 700px;
}

/* Documents Tab Layout */
.documents-tab-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 24px;
}

.documents-sidebar {
    background: var(--light-bg);
    border-radius: 10px;
    padding: 20px;
}

.documents-sidebar h4 {
    font-size: 0.85rem;
    color: var(--violet-cenusiu);
    margin-bottom: 16px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.documents-sidebar-hint {
    margin-top: -10px;
    margin-bottom: 14px;
    font-size: 0.82rem;
    color: var(--violet-cenusiu);
    line-height: 1.35;
}

.documents-sidebar-section{
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--border-soft);
}
.documents-sidebar-section h4{
    margin-top: 0;
}
.doc-type-btn.admin{
    border-color: rgba(81, 127, 137, 0.25);
    background: rgba(81, 127, 137, 0.04);
}
.doc-type-btn.admin:hover{
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.07);
}

.doc-type-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 14px;
    border: 2px solid var(--border-soft);
    background: white;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: 8px;
    text-align: left;
}

.doc-type-btn:hover {
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.05);
}

.doc-type-btn.active {
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.1);
}

.doc-type-btn i {
    font-size: 1.2rem;
    color: var(--verde-albastrui-moderat);
    width: 24px;
    text-align: center;
}

.doc-type-btn span {
    font-size: 0.9rem;
    color: var(--dark-text);
}

.doc-type-btn .doc-type-label {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.doc-type-btn .doc-cas-recommended {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    background: #e4f5ec;
    color: #187449;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .035em;
    line-height: 1;
    text-transform: uppercase;
}

.doc-type-btn.active .doc-cas-recommended {
    background: rgba(255, 255, 255, .82);
    color: #1b6554;
}

/* Documents Main Area */
.documents-main {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Documente administrative (buton Decont, etc.) */
.documents-admin-card .card-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.documents-admin-card .card-title{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:1rem;
    font-weight:600;
}
.documents-admin-card .card-title i{ color: var(--verde-albastrui-moderat); }
.documents-admin-body{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.documents-admin-note{
    display:flex;
    align-items:center;
    gap:8px;
    color: var(--violet-cenusiu);
    font-size: .85rem;
}

/* Modal decont */
.modal.modal-decont{
    max-width: min(1120px, 96vw) !important;
    width: min(1120px, 96vw) !important;
    max-height: 86vh !important;
}

.modal.modal-decont .modal-header{
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.modal.modal-decont .modal-actions{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.modal.modal-decont .modal-body{
    overflow-y: auto;
    max-height: calc(86vh - 68px);
}

.modal.modal-decont .decont-empty{
    background: rgba(81, 127, 137, .05);
    border: 1px dashed rgba(81, 127, 137, .25);
    padding: 12px;
    border-radius: 12px;
    color: var(--violet-cenusiu);
    font-size:.9rem;
}

.modal.modal-decont .decont-grid{
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:14px;
    margin-bottom:14px;
}
@media (max-width: 1200px){
    .modal.modal-decont .decont-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
    .modal.modal-decont .decont-grid{ grid-template-columns: 1fr; }
}

.modal.modal-decont .decont-kv{
    border:1px solid var(--border-soft);
    background:#fff;
    border-radius:12px;
    padding:12px 14px;
    min-height: 64px;
}
.modal.modal-decont .decont-kv span{
    display:block;
    font-size:.78rem;
    color: var(--violet-cenusiu);
    margin-bottom:2px;
}
.modal.modal-decont .decont-kv strong{
    display:block;
    font-size:.95rem;
    color: var(--dark-text);
    font-weight:600;
    line-height:1.2;
}
.modal.modal-decont .decont-kv.total{
    border-color: rgba(81, 127, 137, .25);
    background: rgba(81, 127, 137, .06);
}

.modal.modal-decont .decont-kv.total{
    grid-column: span 2;
}

.modal.modal-decont .decont-mini-table{
    width:100%;
    border-collapse: separate;
    border-spacing: 0;
    border:1px solid var(--border-soft);
    border-radius: 12px;
    overflow:hidden;
    background:#fff;
}
.modal.modal-decont .decont-mini-table thead th{
    background: var(--light-bg);
    color: var(--violet-cenusiu);
    font-size:.78rem;
    padding:12px 14px;
    min-height: 64px;
}
.modal.modal-decont .decont-mini-table td{
    padding:10px 12px;
    border-top:1px solid var(--border-soft);
    font-size:.88rem;
    color: var(--dark-text);
}
.modal.modal-decont .decont-mini-table .tr{ text-align:right; }
.modal.modal-decont .decont-mini-table tr.more td{
    background: #fafbfc;
    color: var(--violet-cenusiu);
    font-style: italic;
    text-align:center;
}

.modal.modal-decont .decont-hint{
    margin-top:10px;
    color: var(--violet-cenusiu);
    font-size:.82rem;
    display:flex;
    align-items:center;
    gap:8px;
}

.documents-history-card {
    max-height: 300px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.documents-history-card .card-body {
    overflow-y: auto;
    flex: 1;
}



/* Decont consultatie (premium) */
.documents-decont-card .card-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.documents-decont-card .card-title{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:1rem;
    margin:0;
}
.documents-decont-card .card-title i{ color: var(--verde-albastrui-moderat); }
.documents-decont-card .doc-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.documents-decont-card .decont-grid{
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:14px;
    margin-bottom:14px;
}
@media (max-width: 1100px){
    .documents-decont-card .decont-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
    .documents-decont-card .decont-grid{ grid-template-columns: 1fr; }
}

.documents-decont-card .decont-kv{
    border:1px solid var(--border-soft);
    background:#fff;
    border-radius:12px;
    padding:12px 14px;
    min-height: 64px;
}
.documents-decont-card .decont-kv span{
    display:block;
    font-size:.78rem;
    color: var(--violet-cenusiu);
    margin-bottom:2px;
}
.documents-decont-card .decont-kv strong{
    display:block;
    font-size:.95rem;
    color: var(--dark-text);
    font-weight:600;
    line-height:1.2;
}
.documents-decont-card .decont-kv.total{
    border-color: rgba(81, 127, 137, .25);
    background: rgba(81, 127, 137, .06);
}

.documents-decont-card .decont-mini-table-wrap{ margin-top: 8px; }
.documents-decont-card .decont-mini-table{
    width:100%;
    border-collapse: separate;
    border-spacing: 0;
    border:1px solid var(--border-soft);
    border-radius: 12px;
    overflow:hidden;
    background:#fff;
}
.documents-decont-card .decont-mini-table thead th{
    background: var(--light-bg);
    color: var(--violet-cenusiu);
    font-size:.78rem;
    text-transform:none;
    letter-spacing:.2px;
    padding:12px 14px;
    min-height: 64px;
}
.documents-decont-card .decont-mini-table td{
    padding:10px 12px;
    border-top:1px solid var(--border-soft);
    font-size:.88rem;
    color: var(--dark-text);
}
.documents-decont-card .decont-mini-table .tr{ text-align:right; }
.documents-decont-card .decont-mini-table tr.more td{
    background: #fafbfc;
    color: var(--violet-cenusiu);
    font-style: italic;
    text-align:center;
}

.documents-decont-card .empty-state{
    background: rgba(81, 127, 137, .05);
    border: 1px dashed rgba(81, 127, 137, .25);
    padding: 12px;
    border-radius: 12px;
    color: var(--violet-cenusiu);
    font-size:.88rem;
}
.documents-decont-card .decont-hint{
    margin-top:10px;
    color: var(--violet-cenusiu);
    font-size:.82rem;
    display:flex;
    align-items:center;
    gap:8px;
}
.documents-history-list .history-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-soft);
    gap: 12px;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s;
}

.documents-history-list .history-item:hover {
    background: var(--light-bg);
}

.documents-history-list .history-item:focus-visible {
    outline: none;
    background: rgba(81,127,137,0.08);
    box-shadow: inset 0 0 0 2px rgba(81,127,137,0.24);
}

.documents-history-list .history-item.is-active {
    background: rgba(81,127,137,0.10);
    box-shadow: inset 0 0 0 1px rgba(81,127,137,0.18);
}

.documents-history-list .history-item:last-child {
    border-bottom: none;
}

.documents-history-list .history-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.documents-history-list .history-details {
    flex: 1;
}

.documents-history-list .history-details strong {
    display: block;
    margin-bottom: 2px;
    font-size: 0.9rem;
}

.documents-history-list .history-details small {
    color: var(--violet-cenusiu);
    font-size: 0.8rem;
}

.documents-history-list .history-meta {
    text-align: right;
    font-size: 0.85rem;
}

.documents-history-list .history-meta .date {
    font-weight: 500;
    color: var(--dark-text);
}

.documents-history-list .history-meta .doctor {
    font-size: 0.8rem;
    color: var(--violet-cenusiu);
}

.documents-history-list .history-actions {
    display: flex;
    gap: 4px;
}

.documents-history-list .btn-icon {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(81,127,137,0.20);
    background: rgba(255,255,255,0.80);
    border-radius: 8px;
    cursor: pointer;
    color: var(--violet-cenusiu);
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.documents-history-list .btn-icon.btn-preview { color: var(--info); }
.documents-history-list .btn-icon.btn-print { color: var(--violet-roscat); }
.documents-history-list .btn-icon.btn-load { color: var(--info); }
.documents-history-list .btn-icon.btn-edit { color: var(--verde-albastrui-moderat); }
.documents-history-list .btn-icon.btn-delete { color: var(--danger); }

.documents-history-list .btn-icon.is-disabled {
    opacity: .35;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}
.documents-history-list .btn-icon.is-disabled:hover {
    background: rgba(255,255,255,0.80);
    border-color: rgba(81,127,137,0.20);
    color: var(--violet-cenusiu);
    transform: none;
    box-shadow: none;
}

.documents-history-list .btn-icon:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(81,127,137,0.18);
}

.documents-history-list .btn-icon.btn-preview:hover {
    background: var(--info);
    border-color: var(--info);
    color: white;
}

.documents-history-list .btn-icon.btn-load:hover {
    background: var(--info);
    border-color: var(--info);
    color: white;
}

.documents-history-list .btn-icon.btn-print:hover {
    background: var(--violet-roscat);
    border-color: var(--violet-roscat);
    color: white;
}

.documents-history-list .btn-icon.btn-edit:hover {
    background: var(--verde-albastrui-moderat);
    border-color: var(--verde-albastrui-moderat);
    color: white;
}

.documents-history-list .btn-icon.btn-delete:hover {
    background: var(--danger);
    border-color: var(--danger);
    color: white;
}

.documents-history-list .btn-icon:not(.btn-preview):not(.btn-print):not(.btn-edit):not(.btn-delete):hover {
    background: var(--verde-albastrui-moderat);
    border-color: var(--verde-albastrui-moderat);
    color: white;
}

/* Document Forms */
.document-form {
    display: none;
}

.document-form.active {
    display: block;
}

.form-section-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--dark-text);
    padding: 12px 0 8px;
    border-bottom: 1px solid var(--border-soft);
    margin: 16px 0 12px;
}

.form-row {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    /* Fără wrap, coloanele care nu încap ies din card în loc să treacă pe rândul
       următor. Se vedea în tab-ul Documente, unde formularul stă pe o coloană
       îngustă: câmpurile ieșeau cu până la 87px peste marginea cardului. */
    flex-wrap: wrap;
}

/* min-width:0 anulează `min-width:auto` implicit al item-elor flex — altfel un
   select/input cu conținut lat împinge coloana peste flex-basis-ul ei. */
.form-row > .form-group { min-width: 0; }

.form-group.col-4 { flex: 0 1 calc(33.33% - 12px); }
.form-group.col-6 { flex: 0 1 calc(50% - 8px); }
.form-group.col-8 { flex: 0 1 calc(66.66% - 8px); }
.form-group.col-12 { flex: 0 1 100%; }

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.checkbox-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.checkbox-item {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.checkbox-item input {
    width: 16px;
    height: 16px;
}

/* Empty State */
.empty-state {
    text-align: center;
    padding: 40px 20px;
    color: var(--violet-cenusiu);
}

.empty-state i {
    font-size: 3rem;
    margin-bottom: 16px;
    color: var(--gri-deschis);
}

.empty-state p {
    margin: 0;
}

/* History list simple */
.history-list-simple {
    list-style: none;
    padding: 0;
}

.history-list-simple li {
    padding: 8px 0;
    border-bottom: 1px solid var(--border-soft);
}

.history-list-simple li:last-child {
    border-bottom: none;
}

/* Timeline */
.consultations-timeline {
    position: relative;
    padding-left: 20px;
}

.consultations-timeline::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--border-soft);
}

.timeline-item {
    position: relative;
    padding: 12px 0 12px 16px;
    border-bottom: 1px solid var(--border-soft);
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: -25px;
    top: 16px;
    width: 10px;
    height: 10px;
    background: var(--verde-albastrui-moderat);
    border-radius: 50%;
}

.timeline-item .timeline-date {
    font-weight: 500;
    margin-bottom: 4px;
}

.timeline-item .timeline-content {
    color: var(--violet-cenusiu);
    font-size: 0.9rem;
}

/* Responsive for tabs */
@media (max-width: 1200px) {
    .patient-row-two {
        grid-template-columns: 1fr;
    }

.documents-tab-layout {
        grid-template-columns: 1fr;
    }
    
    .documents-sidebar {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
    
    .documents-sidebar h4 {
        width: 100%;
    }
    
    .doc-type-btn {
        width: auto;
        flex: 1;
        min-width: 150px;
        margin-bottom: 0;
    }
}

@media (max-width: 768px) {
    .consultation-header-premium {
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }
    
    .consultation-header-premium .patient-header-info {
        flex-direction: column;
    }

    .patient-premium-top {
        flex-direction: column;
        align-items: stretch;
    }

    .patient-premium-stats {
        justify-content: space-between;
    }
    
    .consultation-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .consultation-tab {
        padding: 12px 16px;
        white-space: nowrap;
    }
    
    .consultation-tab span:not(.tab-badge) {
        display: none;
    }
    
    .form-row {
        flex-direction: column;
    }
    
    .form-group.col-4,
    .form-group.col-6,
    .form-group.col-8 {
        flex: 0 0 100%;
    }
}

/* ============================================================
   SERVICES TAB - New Unified Design
   ============================================================ */

.services-tab-new {
    max-width: 1200px;
}

.services-grid-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 24px;
}

/* Left column: Available services */
.services-search-box {
    margin-bottom: 16px;
}

.services-search-box input {
    padding: 12px 16px;
    font-size: 1rem;
}

.services-available-list {
    max-height: 500px;
    overflow-y: auto;
}

.service-category-group {
    margin-bottom: 16px;
}

.category-header {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--violet-cenusiu);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 8px 12px;
    background: var(--light-bg);
    border-left: 3px solid var(--verde-albastrui-moderat);
    margin-bottom: 8px;
}

.service-available-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s;
    background: white;
}

.service-available-item:hover {
    border-color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.05);
    transform: translateX(4px);
}

.service-available-item.adding {
    opacity: 0.5;
    pointer-events: none;
}

.service-item-info {
    flex: 1;
    min-width: 0;
}

.service-item-name {
    display: block;
    font-weight: 500;
    color: var(--dark-text);
    margin-bottom: 2px;
}

.service-item-desc {
    display: block;
    font-size: 0.8rem;
    color: var(--violet-cenusiu);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.service-item-price {
    font-weight: 600;
    color: var(--verde-albastrui-moderat);
    margin: 0 16px;
    white-space: nowrap;
}

.btn-add-service {
    width: 36px;
    height: 36px;
    border: none;
    background: var(--verde-albastrui-moderat);
    color: white;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    flex-shrink: 0;
}

.btn-add-service:hover {
    background: var(--albastru-verzui-moderat);
    transform: scale(1.1);
}

/* Right column: Added services */
.services-added-card .card {
    position: sticky;
    top: 20px;
}

.badge-count {
    background: var(--verde-albastrui-moderat);
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.85rem;
}

.services-added-list {
    min-height: 100px;
}

/* Sections: Plată vs CAS */
.services-added-section {
    padding: 0;
    margin-top: 12px;
}

.services-added-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 8px;
    border-bottom: 1px solid var(--border-soft);
    font-weight: 700;
    color: var(--dark-text);
}

.services-added-section-title .left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.services-added-section-count {
    font-size: 0.85rem;
    background: rgba(81, 127, 137, 0.12);
    color: var(--verde-albastrui-moderat);
    padding: 2px 10px;
    border-radius: 999px;
}

.services-added-section-body {
    padding-top: 4px;
}

.svc-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    margin-left: 8px;
    line-height: 1.2;
}

.svc-pill-cas {
    background: rgba(81, 127, 137, 0.12);
    color: var(--verde-albastrui-moderat);
}

.svc-pill-paid {
    background: rgba(46, 204, 113, 0.12);
    color: var(--success);
}

.service-added-item.is-cas .service-added-price {
    color: var(--verde-albastrui-moderat);
}

.total-pay-new {
    font-size: 1.0rem;
    font-weight: 700;
    padding-top: 10px;
    margin-top: 6px;
    border-top: 1px solid var(--border-soft);
}

.service-added-item {
    display: flex;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--border-soft);
}

.service-added-item:last-child {
    border-bottom: none;
}

.service-added-info {
    flex: 1;
    min-width: 0;
}

.service-added-name {
    display: block;
    font-weight: 500;
    color: var(--dark-text);
}

.service-added-qty,
.service-added-notes {
    display: block;
    font-size: 0.8rem;
    color: var(--violet-cenusiu);
}

.service-added-price {
    font-weight: 600;
    color: var(--success);
    margin: 0 12px;
}

.btn-remove-service {
    width: 28px;
    height: 28px;
    border: none;
    background: #fee;
    color: var(--danger);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.btn-remove-service:hover {
    background: var(--danger);
    color: white;
}

/* Totals */
.services-total-new {
    background: var(--light-bg);
    padding: 16px;
}

.total-line {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    font-size: 0.95rem;
}

.total-grand-new {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--success);
    padding-top: 12px;
    margin-top: 8px;
    border-top: 2px solid var(--border-soft);
}

.empty-state-small {
    text-align: center;
    padding: 30px 20px;
    color: var(--violet-cenusiu);
}

.empty-state-small i {
    font-size: 2rem;
    margin-bottom: 12px;
    color: var(--gri-deschis);
    display: block;
}

/* Responsive */
@media (max-width: 992px) {
    .services-grid-layout {
        grid-template-columns: 1fr;
    }
    
    .services-available-list {
        max-height: 300px;
    }
}

/* ============================================================
   ISTORIC MEDICAL - PREMIUM (mh-*)
   ============================================================ */
.mh-premium{ width:100%; }

.mh-top{
    display:flex; align-items:flex-start; justify-content:space-between;
    gap:16px; flex-wrap:wrap; margin-bottom:14px;
}

.mh-patient{ display:flex; gap:14px; align-items:flex-start; }

.mh-avatar{
    width:56px; height:56px; border-radius:18px;
    display:flex; align-items:center; justify-content:center;
    font-weight:800; letter-spacing:0.5px;
    color: var(--violet-inchis);
    background: linear-gradient(135deg, rgba(81,127,137,0.20), rgba(189,220,219,0.45));
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
}

.mh-patient-info{ min-width: 260px; }
.mh-name{ font-size: 20px; font-weight: 800; }
.mh-meta{ font-size: 13px; color: var(--violet-cenusiu); margin-top:2px; }
.mh-submeta{ font-size: 13px; color: var(--violet-cenusiu); margin-top:4px; }

.mh-alerts{ margin-top: 8px; }
.mh-alert{
    display:inline-flex; align-items:center; gap:8px;
    padding: 8px 10px; border-radius: 12px;
    background: rgba(243,156,18,0.12);
    border: 1px solid rgba(243,156,18,0.22);
    color: #7a4f06;
    font-size: 13px;
}

.mh-actions{ display:flex; gap:10px; align-items:center; }

.mh-stats-grid{
    display:grid; grid-template-columns: repeat(4, minmax(0,1fr));
    gap:12px; margin: 12px 0 18px;
}

.mh-stat{
    background: var(--surface);
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 12px 14px;
    box-shadow: var(--shadow-soft);
}
.mh-stat-val{ font-size: 16px; font-weight: 800; }
.mh-stat-lbl{ font-size: 12px; color: var(--violet-cenusiu); margin-top: 4px; }

.mh-controls{
    display:flex; gap:12px; align-items:center; flex-wrap:wrap;
    margin-bottom: 12px;
}

.mh-search{
    flex: 1 1 320px; position: relative;
}
.mh-search-ic{
    position:absolute; left: 12px; top: 50%; transform: translateY(-50%);
    opacity: 0.75;
}
.mh-search input{ padding-left: 38px; }

.mh-tabs{
    display:flex; gap:8px;
    overflow:auto; padding-bottom: 6px;
    margin: 6px 0 10px;
}

.mh-tab{
    appearance:none; border: 1px solid var(--border-soft);
    background: var(--surface-soft);
    color: var(--violet-inchis);
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 700;
    font-size: 13px;
    cursor:pointer;
    display:inline-flex; align-items:center; gap:8px;
    white-space: nowrap;
    transition: transform .15s ease, background .15s ease, color .15s ease;
}

.mh-tab:hover{ transform: translateY(-1px); }
.mh-tab.active{
    background: linear-gradient(135deg, rgba(52,85,93,0.95), rgba(81,127,137,0.95));
    color: #fff;
    border-color: rgba(255,255,255,0.18);
}

.mh-count{
    display:inline-flex; align-items:center; justify-content:center;
    min-width: 22px; height: 18px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(255,255,255,0.22);
    color: inherit;
    font-size: 12px;
    font-weight: 800;
}

.mh-panels{ margin-top: 6px; }
.mh-panel{ display:none; }
.mh-panel.active{ display:block; }

.mh-empty{
    padding: 18px;
    border-radius: 16px;
    border: 1px dashed rgba(81,127,137,0.28);
    background: rgba(255,255,255,0.65);
    color: var(--violet-cenusiu);
    text-align:center;
}

.mh-event{
    display:flex; gap:12px;
    padding: 12px 12px;
    background: var(--surface);
    border: 1px solid var(--border-soft);
    border-radius: 18px;
    box-shadow: var(--shadow-soft);
    margin-bottom: 10px;
}

.mh-event-icon{
    width: 38px; height: 38px;
    border-radius: 14px;
    background: rgba(81,127,137,0.14);
    display:flex; align-items:center; justify-content:center;
    flex: 0 0 38px;
    font-size: 18px;
}

.mh-event-body{ flex: 1; min-width: 0; }

.mh-event-head{
    display:flex; justify-content:space-between; align-items:flex-start;
    gap: 12px;
}

.mh-event-title{ font-weight: 800; }
.mh-event-meta{ font-size: 13px; color: var(--violet-cenusiu); margin-top: 4px; }

.mh-event-right{ display:flex; align-items:center; gap:8px; white-space:nowrap; }
.mh-date{ font-size: 12px; color: var(--violet-cenusiu); }

.mh-chip{
    display:inline-flex; align-items:center; justify-content:center;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    background: rgba(52,85,93,0.10);
    border: 1px solid rgba(52,85,93,0.16);
    color: var(--violet-inchis);
}

/* Badge premium pentru tipuri de documente (Istoric Medical) */
.mh-chip-doc{
    padding: 4px 10px;
    font-weight: 800;
    letter-spacing: .2px;
    text-transform: none;
    gap: 6px;
}
.mh-chip-doc .mh-chip-ic{ font-size: 12px; line-height: 1; opacity: .9; }

/* Accente subtile per tip (fără culori stridente) */
.mh-doc-letter{ background: rgba(47,111,120,.10); border-color: rgba(47,111,120,.18); }
.mh-doc-echo{ background: rgba(58,140,147,.10); border-color: rgba(58,140,147,.18); }
.mh-doc-ref{ background: rgba(52,85,93,.10); border-color: rgba(52,85,93,.18); }
.mh-doc-cert{ background: rgba(52,85,93,.10); border-color: rgba(52,85,93,.18); }
.mh-doc-note{ background: rgba(52,85,93,.10); border-color: rgba(52,85,93,.18); }
.mh-doc-req{ background: rgba(52,85,93,.10); border-color: rgba(52,85,93,.18); }
.mh-doc-rx{ background: rgba(52,85,93,.10); border-color: rgba(52,85,93,.18); }
.mh-doc-generic{ background: rgba(52,85,93,.08); border-color: rgba(52,85,93,.14); }

.mh-event-actions{ margin-top: 6px; }
.mh-link{
    display:inline-flex; align-items:center; gap:6px;
    font-weight: 700;
    color: var(--violet-roscat);
}
.mh-link:hover{ text-decoration: underline; }

.mh-details{ margin-top: 8px; }
.mh-details summary{
    cursor:pointer;
    font-weight: 800;
    color: var(--violet-inchis);
    list-style: none;
}
.mh-details summary::-webkit-details-marker{ display:none; }
.mh-details summary:after{
    content: '▾';
    display:inline-block;
    margin-left: 8px;
    opacity: .7;
}
.mh-details[open] summary:after{ content: '▴'; }

.mh-details-body{
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(208,219,219,0.45);
    border: 1px solid rgba(81,127,137,0.14);
    display:flex;
    flex-direction:column;
    gap:6px;
    font-size: 13px;
}

.mh-card{
    background: var(--surface);
    border: 1px solid var(--border-soft);
    border-radius: 18px;
    padding: 12px 14px;
    box-shadow: var(--shadow-soft);
    margin-bottom: 10px;
}

.mh-card-top{
    display:flex; justify-content:space-between; align-items:flex-start;
    gap: 12px; margin-bottom: 8px;
}
.mh-card-title{ font-weight: 900; }
.mh-card-sub{ font-size: 13px; color: var(--violet-cenusiu); margin-top: 2px; }
.mh-card-row{ font-size: 13px; margin-top: 6px; }

.mh-split{
    display:grid; grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.mh-box{
    background: var(--surface);
    border: 1px solid var(--border-soft);
    border-radius: 18px;
    padding: 12px 14px;
    box-shadow: var(--shadow-soft);
}

.mh-box-title{ font-weight: 900; margin-bottom: 10px; }
.mh-badges{ display:flex; flex-wrap:wrap; gap:8px; }
.mh-badge{
    display:inline-flex; gap:6px; align-items:center;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(81,127,137,0.12);
    border: 1px solid rgba(81,127,137,0.18);
    font-size: 13px;
    font-weight: 700;
    color: var(--violet-inchis);
}

.mh-list{ display:flex; flex-direction:column; gap:8px; }
.mh-list-row{ display:flex; justify-content:space-between; gap:10px; }
.mh-muted{ font-size: 12px; color: var(--violet-cenusiu); }

@media (max-width: 900px){
    .mh-stats-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
    .mh-split{ grid-template-columns: 1fr; }
}

/* ============================================================
   DOCUMENTE: actiuni vizibile + previzualizare mare
   ============================================================ */

/* Actiuni din istoric (sa se vada chiar daca lipsesc fonturile de icon-uri) */
.documents-history-list .btn-icon{
    width: 36px;
    height: 36px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2px;
}
.documents-history-list .btn-icon .btn-ico{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width: 100%;
    height: auto;
    line-height: 1;
}

/* Culori "always on" (nu doar la hover) */
.documents-history-list .btn-icon.btn-preview{
    color: #0d6efd;
    border-color: rgba(13,110,253,0.35);
    background: rgba(13,110,253,0.10);
}
.documents-history-list .btn-icon.btn-print{
    color: #6f42c1;
    border-color: rgba(111,66,193,0.35);
    background: rgba(111,66,193,0.10);
}



/* ============================================================
   ECOGRAFII (FORMULARE) – UI premium
   ============================================================ */

.doc-profile-row{
    margin-bottom: 10px;
    padding: 12px 14px;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    background: rgba(81,127,137,0.04);
}
.doc-profile-row .text-muted{
    display:block;
    margin-top: 6px;
    font-size: .82rem;
    color: var(--violet-cenusiu);
}

.echo-form-section{
    margin-top: 14px;
    padding: 14px 14px 6px;
    border: 1px solid var(--border-soft);
    border-radius: 18px;
    background: rgba(255,255,255,0.70);
    box-shadow: 0 8px 20px rgba(17,24,39,0.04);
}
.echo-form-title{
    font-weight: 900;
    color: var(--violet-inchis);
    margin-bottom: 10px;
}
.echo-form-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.echo-form-card{
    padding: 12px;
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    background: #fff;
}
.echo-form-card-title{
    font-weight: 800;
    font-size: .9rem;
    color: var(--violet-inchis);
    margin-bottom: 8px;
}

.echo-input-table{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}
.echo-input-table th,
.echo-input-table td{
    padding: 8px 10px;
    border-top: 1px solid var(--border-soft);
    vertical-align: middle;
}
.echo-input-table tr:first-child th,
.echo-input-table tr:first-child td{ border-top: 0; }
.echo-input-table td:first-child{
    width: 46%;
    color: var(--violet-cenusiu);
    font-weight: 800;
    background: rgba(81,127,137,0.04);
}
.echo-input-table input.form-control{
    border-color: rgba(0,0,0,0);
    background: rgba(255,255,255,0.88);
    box-shadow: none;
}

.echo-input-table-wide thead th{
    border-top: 0;
    background: rgba(124,58,237,0.08);
    color: var(--violet-inchis);
    font-weight: 900;
    font-size: .78rem;
    letter-spacing: .4px;
    text-transform: uppercase;
}
.echo-input-table-wide td:first-child{
    width: 120px;
    background: rgba(124,58,237,0.04);
    color: var(--violet-inchis);
}

.echo-org-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}

@media (max-width: 1100px){
    .echo-form-grid{ grid-template-columns: 1fr; }
    .echo-org-grid{ grid-template-columns: 1fr; }
}

/* Previzualizare document: modal aproape fullscreen */
.modal-doc-preview{
    max-width: min(1400px, 96vw) !important;
    width: 96vw !important;
    height: 92vh;
    max-height: 92vh !important;
}
.modal-doc-preview .doc-preview-body{
    padding: 0 !important;
    overflow: hidden !important;
    height: calc(92vh - 64px);
}
.modal-doc-preview iframe{
    border-radius: 0 0 20px 20px;
}




/* ============================================================
   PROFILE DOCUMENTE (ECO etc.)
   ============================================================ */
.modal-doc-profiles{
    max-width: min(980px, 96vw) !important;
    width: 96vw !important;
    height: 84vh;
    max-height: 84vh !important;
}
.modal-doc-profiles .modal-body{
    overflow: auto;
    height: calc(84vh - 120px);
}
.doc-profiles-toolbar{
    display:flex;
    gap: 12px;
    align-items:flex-end;
    justify-content:space-between;
    flex-wrap:wrap;
    padding: 6px 0 12px;
    border-bottom: 1px solid var(--border-soft);
    margin-bottom: 12px;
}
.doc-profiles-toolbar-actions{
    display:flex;
    gap: 8px;
    flex-wrap:wrap;
}
.doc-profiles-hint{
    margin: 10px 0 0;
    color: var(--violet-cenusiu);
    font-size: .86rem;
    line-height: 1.4;
}

/* ============================================================
   PROFILE SCRISOARE MEDICALĂ (Anexa 43)
   ============================================================ */

.modal-ml-profiles{
    max-width: min(1200px, 96vw) !important;
    width: 96vw !important;
    height: 92vh;
    max-height: 92vh !important;
}

.modal-ml-profiles .modal-body{
    overflow: auto;
    height: calc(92vh - 120px);
}

.ml-profiles-toolbar{
    display: flex;
    gap: 12px;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 6px 0 12px;
    border-bottom: 1px solid var(--border-soft);
    margin-bottom: 12px;
}

.ml-profiles-toolbar-actions{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.section-title{
    font-weight: 900;
    color: var(--violet-inchis);
    margin: 10px 0 2px;
}

/* ============================================================
   Investigații (catalog + selector documente) - premium
   ============================================================ */

.inv-admin-grid{
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 16px;
}

.inv-admin-card{
    background: #fff;
    border: 1px solid var(--border-soft);
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    padding: 14px;
}

.inv-admin-card .inv-admin-head{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.inv-admin-title{
    font-weight: 900;
    color: var(--violet-inchis);
    font-size: 15px;
}

.inv-admin-sub{
    color: rgba(15, 23, 42, 0.65);
    font-size: 12px;
    margin-top: 2px;
}

.inv-admin-actions{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.inv-table{
    width: 100%;
    border-collapse: collapse;
}

.inv-table th,
.inv-table td{
    padding: 10px 10px;
    border-bottom: 1px solid var(--border-soft);
    vertical-align: middle;
    font-size: 13px;
}

.inv-table th{
    text-align: left;
    color: rgba(15, 23, 42, 0.75);
    font-weight: 800;
}

.inv-badge{
    display: inline-block;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(124, 58, 237, 0.10);
    color: rgb(88, 28, 135);
    font-weight: 800;
    font-size: 11px;
}

.inv-btn-icon{
    border: 1px solid var(--border-soft);
    background: #fff;
    border-radius: 10px;
    padding: 6px 8px;
    cursor: pointer;
}

.inv-btn-icon:hover{
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.inv-btn-row{
    display: flex;
    gap: 6px;
    align-items: center;
}

.inv-muted{
    color: rgba(15, 23, 42, 0.65);
    font-size: 12px;
}

.inv-chip-area{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px;
    border: 1px dashed rgba(124, 58, 237, 0.35);
    border-radius: 14px;
    background: rgba(124, 58, 237, 0.04);
}

.inv-chip{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--border-soft);
    font-size: 12px;
    font-weight: 700;
}

.inv-chip .x{
    opacity: .65;
    cursor: pointer;
    font-weight: 900;
}

.inv-chip .x:hover{ opacity: 1; }

.inv-modal{
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(2, 6, 23, 0.55);
    z-index: 9999;
}

.inv-modal .inv-modal-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(1100px, 94vw);
    max-height: 92vh;
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 30px 90px rgba(2, 6, 23, 0.35);
    overflow: hidden;
}

.inv-modal .inv-modal-head{
    padding: 14px 16px;
    background: linear-gradient(135deg, rgba(124,58,237,0.18), rgba(59,130,246,0.10));
    border-bottom: 1px solid var(--border-soft);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.inv-modal .inv-modal-title{
    font-weight: 900;
    color: var(--violet-inchis);
    font-size: 15px;
}

.inv-modal .inv-modal-body{
    padding: 14px 16px;
    overflow: auto;
    max-height: calc(92vh - 130px);
}

.inv-picker-grid{
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 14px;
}

.inv-cat-box{
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 12px;
    background: #fff;
}

.inv-cat-title{
    font-weight: 900;
    color: var(--violet-inchis);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.inv-items{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.inv-item{
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    padding: 8px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    background: rgba(2, 6, 23, 0.02);
}

.inv-item:hover{ box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08); }

.inv-item .name{ font-weight: 800; font-size: 12px; }
.inv-item .code{ font-size: 11px; opacity: .65; }

.inv-item.selected{
    border-color: rgba(124, 58, 237, 0.55);
    background: rgba(124, 58, 237, 0.06);
}

.inv-toolbar{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 12px;
}

.inv-toolbar .form-group{ margin: 0; }

.inv-modal .inv-modal-footer{
    padding: 12px 16px;
    border-top: 1px solid var(--border-soft);
    background: rgba(2, 6, 23, 0.02);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.inv-footer-actions{ display: flex; gap: 10px; flex-wrap: wrap; }



/* INVESTIGATII MODAL v2 */
.inv-modal{
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,0.55);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  z-index: 9999;
}
.inv-modal-card{
  width: min(1100px, 95vw);
  max-height: 92vh;
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 24px 60px rgba(0,0,0,0.28);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.inv-modal-card.sm{
  width: min(980px, 95vw);
}
.inv-modal-header{
  padding: 14px 16px;
  border-bottom: 1px solid var(--border-soft);
  background: linear-gradient(90deg, rgba(124,58,237,0.16), rgba(14,165,233,0.12));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.inv-modal-title{
  font-weight: 900;
  color: var(--violet-inchis);
  display: flex;
  align-items: center;
  gap: 10px;
}
.inv-modal-close{
  border: none;
  background: rgba(15,23,42,0.06);
  color: rgba(15,23,42,0.7);
  width: 36px;
  height: 36px;
  border-radius: 12px;
  cursor: pointer;
  font-size: 18px;
}
.inv-modal-close:hover{ background: rgba(15,23,42,0.1); }
.inv-modal-body{
  padding: 14px;
  overflow: auto;
}
.inv-modal-toolbar{
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.inv-search{
  flex: 1;
  min-width: 240px;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  outline: none;
}
.inv-modal-grid{
  display: grid;
  grid-template-columns: 1.4fr 0.9fr;
  gap: 14px;
}
.inv-catalog{
  max-height: 58vh;
  overflow: auto;
  padding-right: 6px;
}
.inv-selected{
  border: 1px solid var(--border-soft);
  border-radius: 18px;
  padding: 12px;
  background: rgba(2,6,23,0.02);
}
.inv-selected-title{
  font-weight: 900;
  color: var(--violet-inchis);
  margin-bottom: 10px;
}
.inv-selected-list{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.inv-manual{ margin-top: 12px; }
.inv-manual-row{ display: flex; gap: 8px; align-items: center; }
.inv-manual-row .form-control{ flex: 1; }
.inv-profile-bar{
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.inv-profile-label{ font-weight: 800; color: rgba(15,23,42,0.72); }
.inv-profile-select{ min-width: 260px; }
.inv-modal-footer{
  padding: 12px 16px;
  border-top: 1px solid var(--border-soft);
  background: rgba(2,6,23,0.02);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.inv-profiles-top{ display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.inv-profiles-actions{ display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.inv-profiles-editor{ margin-top: 14px; border: 1px solid var(--border-soft); border-radius: 18px; padding: 12px; background: rgba(2,6,23,0.02); }
.inv-profiles-editor-title{ font-weight: 900; color: var(--violet-inchis); margin-bottom: 10px; }

@media (max-width: 980px){
  .inv-modal-grid{ grid-template-columns: 1fr; }
  .inv-catalog{ max-height: 44vh; }
}

/* INVESTIGATII ADMIN (setari) */
.inv-admin-layout{ display: grid; grid-template-columns: 1fr 1.2fr; gap: 16px; }
.inv-admin-col{ border: 1px solid var(--border-soft); border-radius: 20px; padding: 14px; background: rgba(2,6,23,0.02); }
.inv-admin-head{ display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.inv-admin-title{ font-weight: 900; color: var(--violet-inchis); }
.inv-admin-hint{ font-size: 12px; color: rgba(15,23,42,0.62); }
.inv-admin-filter{ margin-bottom: 10px; }
.inv-admin-pill{ display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(124,58,237,0.25); background: rgba(124,58,237,0.08); font-weight: 900; font-size: 12px; color: var(--violet-inchis); }

/* ─────────────────────────────────────────────────────────────
   Queue scope badges (Cabinet Medic / Cabinet Asistent)
   ───────────────────────────────────────────────────────────── */
.scope-badges{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px; }
.scope-label{ font-size:12px; font-weight:900; opacity:.85; color: rgba(255,255,255,.85); }
.scope-pill{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.12); color: rgba(255,255,255,.92); font-size:12px; font-weight:800; backdrop-filter: blur(6px); }
.scope-pill svg{ opacity:.9; }
@media (max-width: 980px){ .inv-admin-layout{ grid-template-columns: 1fr; } }

/* ============================================================
   ADMIN - Acces Meniu (sidebar) per user
   ============================================================ */
.admin-perm-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 18px;
    align-items: start;
}

@media (max-width: 992px) {
    .admin-perm-grid { grid-template-columns: 1fr; }
}

.user-list-scroll {
    max-height: 560px;
    overflow: auto;
    padding-right: 6px;
}

.quick-item-link {
    text-decoration: none;
    color: inherit;
}

.quick-item-link.active {
    outline: 2px solid rgba(196, 43, 175, 0.25);
}

.perm-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.btn.btn-sm {
    padding: 8px 12px;
    font-size: 12px;
    border-radius: 10px;
}

.perm-section-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--violet-inchis);
    margin-bottom: 10px;
}

.perm-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 10px 16px;
}

@media (max-width: 768px) {
    .perm-grid { grid-template-columns: 1fr; }
}

.perm-check {
    background: var(--light-bg);
    padding: 10px 12px;
    border-radius: 12px;
}

/* ==========================
   SweetAlert2 (Premium)
   ========================== */
.mi-swal-popup {
    border-radius: 18px !important;
}

.mi-swal-toast {
    border-radius: 14px !important;
}

/* ==========================
   SweetAlert2 - Asistent la încasare (Ultra Premium)
   ========================== */
.mi-swal-assistant-pick {
    width: min(620px, calc(100vw - 32px)) !important;
    max-width: min(620px, calc(100vw - 32px)) !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    padding: 22px 24px 18px !important;
}

.mi-swal-assistant-pick .swal2-title {
    font-size: 28px !important;
    font-weight: 900 !important;
    letter-spacing: -0.4px;
    color: var(--violet-inchis) !important;
}

.mi-swal-assistant-pick .swal2-icon {
    transform: scale(0.92);
    margin-top: 10px !important;
}

.mi-swal-assistant-pick .swal2-html-container {
    margin: 10px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.mi-swal-assistant-pick .mi-swal-assistant-body {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    text-align: left;
}

.mi-swal-assistant-pick .mi-swal-sub {
    color: #6b7a86;
    font-size: 17px;
    line-height: 1.5;
    margin: 0;
}

.mi-swal-assistant-pick .mi-swal-field {
    width: 100%;
}

.mi-swal-assistant-pick .mi-swal-field-label {
    display: block;
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 800;
    color: #41515f;
}

.mi-swal-assistant-pick .mi-swal-select {
    /* Fix overflow / contur urât pe select (Chrome adaugă outline la focus)
       + păstrăm aspect premium fără să "iasă" din chenar */
    /* IMPORTANT: SweetAlert2 setează implicit margin lateral (ex: 2em) pe select.
       Dacă lăsăm margin-ul implicit, width:100% + margin => iese din chenar.
       Resetăm margin-ul complet și controlăm noi spacing-ul. */
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    border-radius: 14px !important;
    min-height: 50px !important;
    padding: 12px 16px !important;
    font-weight: 700;
    font-size: 16px !important;
    line-height: 1.2 !important;
    background: #fff !important;
    outline: none !important;
    border: 1px solid rgba(47, 79, 86, 0.18) !important;
    box-shadow: 0 10px 22px rgba(52, 85, 93, 0.07);
}

.mi-swal-assistant-pick .mi-swal-select:focus {
    outline: none !important;
    border-color: rgba(119, 70, 180, 0.45) !important;
    /* ring "inset" ca să nu depășească chenarul */
    box-shadow: inset 0 0 0 2px rgba(119, 70, 180, 0.22), 0 12px 28px rgba(52, 85, 93, 0.10);
}

.mi-swal-assistant-pick .swal2-select:not(.mi-swal-select),
.mi-swal-assistant-pick .swal2-input,
.mi-swal-assistant-pick .swal2-textarea,
.mi-swal-assistant-pick .swal2-range,
.mi-swal-assistant-pick .swal2-file,
.mi-swal-assistant-pick .swal2-radio,
.mi-swal-assistant-pick .swal2-checkbox {
    display: none !important;
}

.mi-swal-assistant-pick .swal2-actions {
    width: 100% !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    margin-top: 16px !important;
    gap: 10px;
}

.mi-swal-assistant-pick .swal2-actions .btn {
    min-width: 150px;
    padding: 12px 18px;
    margin: 0 !important;
    border-radius: 12px;
}

/* Toast SweetAlert2 (implicit) */
.swal2-popup.swal2-toast {
    border-radius: 14px !important;
}

.swal2-popup .btn {
    margin: 0 6px;
}

.swal2-container {
    /* peste sidebar/modale premium */
    z-index: 100000;
}

/* ==========================
   SweetAlert2 Upload (Premium)
   ========================== */
.mi-swal-upload {
    padding: 22px 22px 18px !important;
}

.mi-swal-upload .swal2-title {
    font-size: 28px !important;
    font-weight: 900 !important;
    letter-spacing: -0.4px;
    color: var(--violet-inchis) !important;
}

.mi-swal-upload .swal2-html-container {
    margin: 14px 0 0 !important;
    padding: 0 !important;
}

.mi-swal-upload .swal2-actions {
    margin-top: 18px !important;
    gap: 10px;
}

.mi-swal-upload .swal2-actions .btn {
    min-width: 140px;
    margin: 0 !important;
}

.mi-upload-wrap {
    text-align: left;
}

.mi-upload-drop {
    border: 2px dashed rgba(81,127,137,0.35);
    background: rgba(255,255,255,0.75);
    border-radius: 18px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 8px 24px rgba(52,85,93,0.08);
}

.mi-upload-drop:hover {
    border-color: var(--violet-roscat);
    box-shadow: 0 12px 34px rgba(52,85,93,0.12);
    transform: translateY(-1px);
}

.mi-upload-drop.dragover {
    border-color: var(--success);
    background: rgba(18,171,120,0.07);
}

.mi-upload-drop input[type="file"] {
    display: none;
}

.mi-upload-drop-inner {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.mi-upload-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    box-shadow: 0 8px 18px rgba(81,127,137,0.22);
    font-size: 20px;
    flex: 0 0 48px;
}

.mi-upload-text {
    flex: 1;
    min-width: 0;
}

.mi-upload-title {
    font-weight: 900;
    color: var(--negru);
    font-size: 15px;
    margin-top: 2px;
}

.mi-upload-sub {
    font-size: 12px;
    color: var(--violet-cenusiu);
    margin-top: 4px;
}

.mi-upload-file {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(81,127,137,0.10);
    color: var(--violet-inchis);
    font-size: 12px;
    font-weight: 600;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mi-upload-file.has-file {
    background: rgba(18,171,120,0.12);
    color: #0f6d4d;
}

.mi-upload-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 14px;
    margin-top: 14px;
}

.mi-col-span-2 {
    grid-column: 1 / -1;
}

@media (max-width: 640px) {
    .mi-upload-grid { grid-template-columns: 1fr; }
    .mi-col-span-2 { grid-column: 1; }
}

/* ============================================================
   DASHBOARD PREMIUM v2
   ============================================================ */

.dashboard-premium {
    animation: fadeIn 0.4s ease;
}

/* Stats Premium Grid */
.stats-premium-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: 28px;
}

.stat-premium-card {
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(81,127,137,0.10);
    border-radius: 22px;
    padding: 22px 24px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

.stat-premium-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.stat-premium-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(26,35,50,0.08);
    border-color: rgba(81,127,137,0.18);
}

.stat-premium-card:hover::before { opacity: 1; }

.stat-premium-card:nth-child(1)::before { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.stat-premium-card:nth-child(2)::before { background: linear-gradient(90deg, var(--verde-albastrui-moderat), #5A9BA3); }
.stat-premium-card:nth-child(3)::before { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.stat-premium-card:nth-child(4)::before { background: linear-gradient(90deg, #10b981, #34d399); }

/* Staggered animation */
.stat-premium-card:nth-child(1) { animation: fadeIn 0.45s 0.08s cubic-bezier(0.4,0,0.2,1) both; }
.stat-premium-card:nth-child(2) { animation: fadeIn 0.45s 0.14s cubic-bezier(0.4,0,0.2,1) both; }
.stat-premium-card:nth-child(3) { animation: fadeIn 0.45s 0.20s cubic-bezier(0.4,0,0.2,1) both; }
.stat-premium-card:nth-child(4) { animation: fadeIn 0.45s 0.26s cubic-bezier(0.4,0,0.2,1) both; }

.stat-premium-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 14px;
}

.stat-premium-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.stat-premium-icon.blue { background: rgba(59,130,246,0.10); color: #3b82f6; }
.stat-premium-icon.teal { background: rgba(81,127,137,0.12); color: var(--verde-albastrui-moderat); }
.stat-premium-icon.orange { background: rgba(245,158,11,0.10); color: #f59e0b; }
.stat-premium-icon.green { background: rgba(16,185,129,0.10); color: #10b981; }

.stat-premium-trend {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 11.5px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 20px;
}

.stat-premium-trend.up { background: rgba(16,185,129,0.10); color: #059669; }
.stat-premium-trend.neutral { background: rgba(148,163,184,0.12); color: #64748b; }

.stat-premium-value {
    font-size: 30px;
    font-weight: 800;
    color: var(--negru);
    line-height: 1.1;
    letter-spacing: -0.5px;
    margin-bottom: 4px;
}

.stat-premium-label {
    font-size: 13px;
    color: #8194a5;
    font-weight: 500;
}

.stat-premium-progress {
    margin-top: 12px;
}

.progress-bar {
    height: 5px;
    background: rgba(59,130,246,0.10);
    border-radius: 3px;
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    border-radius: 3px;
    transition: width 0.6s cubic-bezier(0.4,0,0.2,1);
}

.progress-fill.blue {
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
}

.progress-fill:not(.blue) {
    background: linear-gradient(90deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
}

.progress-meta {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #8194a5;
    margin-top: 6px;
    font-weight: 500;
}

/* Dashboard Grid */
.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 1fr);
    gap: 22px;
}

.dashboard-col-main,
.dashboard-col-side {
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-width: 0;
    height: 100%;
}

/* Dashboard Cards */
.dashboard-card {
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(81,127,137,0.10);
    border-radius: 22px;
    overflow: hidden;
    transition: all 0.3s ease;
    min-width: 0;
}

.dashboard-card:hover {
    box-shadow: 0 2px 8px rgba(26,35,50,0.06);
    border-color: rgba(81,127,137,0.18);
}

/* Staggered card animations */
.dashboard-col-main .dashboard-card:nth-child(1) { animation: fadeIn 0.5s 0.30s cubic-bezier(0.4,0,0.2,1) both; }
.dashboard-col-main .dashboard-card:nth-child(2) { animation: fadeIn 0.5s 0.36s cubic-bezier(0.4,0,0.2,1) both; }
.dashboard-col-side .dashboard-card:nth-child(1) { animation: fadeIn 0.5s 0.32s cubic-bezier(0.4,0,0.2,1) both; }
.dashboard-col-side .dashboard-card:nth-child(2) { animation: fadeIn 0.5s 0.38s cubic-bezier(0.4,0,0.2,1) both; }

.dashboard-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.10);
    gap: 12px;
}

.card-header-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--negru);
    white-space: nowrap;
}

.card-header-title svg { color: var(--verde-albastrui-moderat); }

.card-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.card-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--verde-albastrui-moderat);
    text-decoration: none;
    transition: all 0.2s ease;
}

.card-link:hover {
    color: var(--albastru-verzui-moderat);
    gap: 8px;
    text-decoration: none;
}

.dashboard-card-body {
    padding: 18px 22px;
}

.dashboard-card-body.no-padding {
    padding: 0;
}

/* Chart Card */
.chart-card .dashboard-card-header {
    border-bottom: none;
    padding-bottom: 10px;
}

.chart-legend {
    display: flex;
    gap: 16px;
    align-items: center;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #8194a5;
    font-weight: 500;
}

.legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.legend-dot.appointments {
    background: linear-gradient(135deg, var(--verde-albastrui-moderat), var(--albastru-verzui-moderat));
}

.legend-dot.today-dot {
    background: linear-gradient(135deg, #60a5fa, #3b82f6);
}

.mini-chart {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    height: 150px;
    padding: 0 22px 18px;
}

.chart-bar-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    height: 100%;
    justify-content: flex-end;
}

.chart-bar-outer {
    width: 100%;
    max-width: 44px;
    display: flex;
    align-items: flex-end;
    flex: 1;
}

.chart-bar {
    width: 100%;
    border-radius: 8px 8px 4px 4px;
    background: linear-gradient(180deg, var(--verde-albastrui-moderat), var(--albastru-verzui-moderat));
    min-height: 4px;
    position: relative;
    transition: all 0.4s cubic-bezier(0.4,0,0.2,1);
    cursor: pointer;
}

.chart-bar.is-today {
    background: linear-gradient(180deg, #60a5fa, #3b82f6);
    box-shadow: 0 4px 14px rgba(59,130,246,0.25);
}

.chart-bar.is-zero {
    background: rgba(81,127,137,0.08);
    min-height: 4px;
}

.chart-bar:hover {
    filter: brightness(1.1);
    transform: scaleY(1.03);
    transform-origin: bottom;
}

.chart-tooltip,
.chart-bar .chart-tooltip {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--albastru-verzui-moderat);
    color: white;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.chart-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 4px solid transparent;
    border-top-color: var(--albastru-verzui-moderat);
}

.chart-bar:hover .chart-tooltip { opacity: 1; }

.chart-label {
    font-size: 11.5px;
    font-weight: 600;
    color: #8194a5;
    text-transform: capitalize;
}

.chart-label.is-today {
    color: #3b82f6;
    font-weight: 700;
}

/* Appointment List */
.appointments-list {
    display: flex;
    flex-direction: column;
    max-height: clamp(260px, 46vh, 540px);
    overflow: auto;
}

/* Dashboard: Programări Azi (fără grafic) */
.dashboard-card.appointments-today-card .appointments-list {
    max-height: none;
}

/* Dashboard: Programări Azi – întins la același nivel cu coloana din dreapta */
.dashboard-card.appointments-today-card {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.dashboard-card.appointments-today-card .dashboard-card-body {
    flex: 1 1 auto;
    min-height: 0; /* necesar pentru overflow în flex */
}

.dashboard-card.appointments-today-card .appointments-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}


.appointment-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.08);
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
    cursor: pointer;
}

.appointment-item:last-child { border-bottom: none; }

.appointment-item:hover {
    background: rgba(58,138,159,0.04);
    text-decoration: none;
}

.appointment-time {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 52px;
    flex-shrink: 0;
}

.appointment-time .time-value {
    font-size: 14px;
    font-weight: 700;
    color: var(--negru);
    font-family: 'JetBrains Mono', 'DM Sans', monospace;
}

.appointment-time .time-end {
    font-size: 11px;
    color: #8194a5;
    font-family: 'JetBrains Mono', 'DM Sans', monospace;
}

.appointment-indicator {
    width: 3px;
    height: 42px;
    border-radius: 2px;
    flex-shrink: 0;
}

.appointment-info {
    flex: 1;
    min-width: 0;
}

.appointment-patient {
    font-size: 13.5px;
    font-weight: 650;
    color: var(--negru);
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.appointment-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #8194a5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.appointment-meta .meta-dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #8194a5;
    opacity: 0.4;
    flex-shrink: 0;
}

.appointment-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 650;
    white-space: nowrap;
    flex-shrink: 0;
}

.appointment-status.scheduled { background: rgba(59,130,246,0.10); color: #3b82f6; }
.appointment-status.waiting { background: rgba(245,158,11,0.10); color: #d97706; }
.appointment-status.in-progress { background: rgba(139,92,246,0.10); color: #7c3aed; }
.appointment-status.completed { background: rgba(16,185,129,0.10); color: #059669; }

/* Pulse for in-progress */
.appointment-status.in-progress::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #7c3aed;
    animation: statusPulse 1.5s ease infinite;
}

@keyframes statusPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.3); }
}

/* Filter Selects */
.filter-select {
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    color: #526778;
    padding: 6px 28px 6px 10px;
    border: 1px solid rgba(81,127,137,0.18);
    border-radius: 8px;
    background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23526778' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    transition: all 0.2s ease;
    max-width: 160px;
}

.filter-select:focus {
    outline: none;
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81,127,137,0.12);
}

.filter-select-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    list-style: none;
    min-width: 128px;
    user-select: none;
}

.filter-select-button::-webkit-details-marker { display: none; }
.filter-select-button::marker { content: ''; }

.status-multifilter {
    position: relative;
    z-index: 120;
}

.status-multifilter[open] {
    z-index: 180;
}

.status-multifilter[open] .filter-select-button {
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81,127,137,0.12);
}

.status-filter-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: min(560px, calc(100vw - 48px));
    min-width: 520px;
    max-height: min(78vh, 640px);
    overflow: auto;
    padding: 18px;
    border-radius: 20px;
    background: rgba(255,255,255,0.99);
    border: 1px solid rgba(81,127,137,0.14);
    box-shadow: 0 22px 52px rgba(30, 58, 74, 0.20);
    backdrop-filter: blur(12px);
    z-index: 9999;
}

.status-filter-menu-title {
    font-size: 12px;
    font-weight: 800;
    color: #385260;
    margin-bottom: 12px;
}

.status-filter-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 14px;
}

.status-filter-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
    min-height: 68px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(81,127,137,0.10);
    background: linear-gradient(180deg, rgba(81,127,137,0.05) 0%, rgba(81,127,137,0.035) 100%);
    cursor: pointer;
    transition: all 0.2s ease;
}

.status-filter-option:hover {
    background: rgba(81,127,137,0.08);
    border-color: rgba(81,127,137,0.18);
}

.status-filter-option input {
    width: 16px;
    height: 16px;
    accent-color: var(--verde-albastrui-moderat);
    margin: 0;
    flex-shrink: 0;
}

.status-filter-option .appointment-status {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    white-space: normal;
    text-align: left;
    line-height: 1.3;
    padding: 10px 12px;
    border-radius: 14px;
    font-size: 12.5px;
    font-weight: 750;
}

.status-filter-presets,
.status-filter-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.status-filter-presets {
    padding-top: 14px;
    border-top: 1px solid rgba(81,127,137,0.08);
}

.status-preset-btn,
.status-filter-link {
    border: none;
    border-radius: 999px;
    background: rgba(81,127,137,0.08);
    color: #4b6977;
    font-size: 12px;
    font-weight: 700;
    padding: 9px 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.status-preset-btn:hover,
.status-filter-link:hover {
    color: var(--verde-albastrui-moderat);
    background: rgba(81,127,137,0.14);
}

.status-filter-apply {
    border: none;
    border-radius: 14px;
    padding: 11px 18px;
    background: linear-gradient(135deg, var(--verde-inchis) 0%, var(--verde-albastrui-moderat) 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(81,127,137,0.16);
}

.appointment-status.cancelled { background: rgba(220,53,69,0.10); color: #dc3545; }
.appointment-status.no-show { background: rgba(17,24,39,0.10); color: #1f2937; }
.appointment-status.rescheduled { background: rgba(14,165,233,0.10); color: #0284c7; }

.status-multifilter-sidebar .status-filter-menu {
    left: 0;
    right: auto;
    width: min(520px, calc(100vw - 56px));
    min-width: 430px;
    max-height: min(78vh, 680px);
    padding: 20px;
    border-radius: 22px;
}

.status-multifilter-sidebar .status-filter-menu-title {
    margin-bottom: 14px;
    font-size: 12px;
    letter-spacing: 0.02em;
}

.status-multifilter-sidebar .status-filter-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.status-multifilter-sidebar .status-filter-option {
    align-items: center;
    min-height: 66px;
    padding: 12px 14px;
    border-radius: 16px;
}

.status-multifilter-sidebar .status-filter-option input {
    width: 18px;
    height: 18px;
}

.status-multifilter-sidebar .status-filter-option .appointment-status {
    padding: 10px 12px;
    border-radius: 13px;
    font-size: 13px;
    line-height: 1.2;
}

.status-multifilter-sidebar .status-filter-presets {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.status-multifilter-sidebar .status-filter-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
}

.status-multifilter-sidebar .status-preset-btn,
.status-multifilter-sidebar .status-filter-link,
.status-multifilter-sidebar .status-filter-apply {
    width: 100%;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 14px;
    text-align: center;
}

.status-multifilter-sidebar .status-filter-link {
    background: rgba(81,127,137,0.06);
    border: 1px solid rgba(81,127,137,0.10);
}

.status-multifilter-sidebar .status-filter-apply {
    box-shadow: 0 12px 24px rgba(81,127,137,0.16);
}


/* Collect Card */
.collect-total {
    font-size: 20px;
    font-weight: 800;
    color: var(--albastru-verzui-moderat);
    font-family: 'JetBrains Mono', 'DM Sans', monospace;
}

.collect-list {
    display: flex;
    flex-direction: column;
    max-height: clamp(220px, 34vh, 380px);
    overflow: auto;
}

.collect-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 22px;
    border-bottom: 1px solid rgba(81,127,137,0.08);
    transition: all 0.3s ease;
}

.collect-item:last-child { border-bottom: none; }

.collect-item:hover { background: rgba(58,138,159,0.03); }

.collect-info { flex: 1; min-width: 0; }

.collect-patient {
    font-size: 13px;
    font-weight: 650;
    color: var(--negru);
    margin-bottom: 2px;
}

.collect-doctor,
.collect-service {
    font-size: 11.5px;
    color: #8194a5;
}

.collect-action {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.collect-amount {
    font-size: 14px;
    font-weight: 700;
    color: var(--negru);
    font-family: 'JetBrains Mono', 'DM Sans', monospace;
}

.btn-collect {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 650;
    font-family: inherit;
    border: none;
    cursor: pointer;
    background: rgba(16,185,129,0.10);
    color: #059669;
    transition: all 0.2s ease;
}

.btn-collect:hover {
    background: #10b981;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(16,185,129,0.25);
}

.btn-collect .spin {
    animation: spin 0.6s linear infinite;
}

/* Quick Actions */
.quick-actions-card .dashboard-card-header {
    border-bottom: none;
}

.quick-actions-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 22px 22px;
}

.quick-action {
    --quick-accent: var(--verde-albastrui-moderat);
    --quick-accent-soft: rgba(81,127,137,0.12);
    --quick-accent-strong: rgba(81,127,137,0.18);
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 18px 18px 20px;
    min-height: 94px;
    border-radius: 18px;
    text-decoration: none;
    color: #47616f;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(248,251,252,0.94) 100%),
        linear-gradient(135deg, var(--quick-accent-soft) 0%, rgba(255,255,255,0) 70%);
    border: 1px solid rgba(81,127,137,0.12);
    transition: all 0.25s ease;
    overflow: hidden;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.68),
        0 8px 22px rgba(46,72,87,0.06);
}

.quick-action::before {
    content: '';
    position: absolute;
    left: 0;
    top: 14px;
    bottom: 14px;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--quick-accent) 0%, rgba(255,255,255,0.82) 100%);
}

.quick-action::after {
    content: '→';
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    font-weight: 700;
    color: rgba(71,97,111,0.36);
    transition: all 0.25s ease;
}

.quick-action:hover {
    background:
        linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(245,250,251,0.98) 100%),
        linear-gradient(135deg, var(--quick-accent-soft) 0%, rgba(255,255,255,0) 72%);
    border-color: var(--quick-accent-strong);
    color: var(--albastru-verzui-moderat);
    transform: translateY(-3px);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.78),
        0 14px 28px rgba(46,72,87,0.1);
    text-decoration: none;
}

.quick-action-icon {
    position: relative;
    z-index: 1;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,0.9) 0%, rgba(246,250,251,0.96) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--quick-accent);
    transition: all 0.25s ease;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.7),
        0 6px 14px rgba(46,72,87,0.08);
    border: 1px solid rgba(255,255,255,0.72);
}

.quick-action:hover .quick-action-icon {
    background: var(--quick-accent);
    color: white;
    box-shadow: 0 10px 20px rgba(46,72,87,0.16);
}

.quick-action:focus-visible {
    outline: none;
    border-color: var(--quick-accent);
    box-shadow:
        0 0 0 3px rgba(81,127,137,0.16),
        0 14px 28px rgba(46,72,87,0.1);
}

.quick-action-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    padding-right: 24px;
}

.quick-action-title {
    font-size: 14px;
    line-height: 1.2;
    font-weight: 700;
    color: #284451;
}

.quick-action-sub {
    display: -webkit-box;
    overflow: hidden;
    font-size: 12px;
    line-height: 1.42;
    font-weight: 500;
    color: #728794;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.quick-action:hover .quick-action-title {
    color: #1d3f4b;
}

.quick-action:hover::after {
    color: var(--quick-accent);
    transform: translateY(-50%) translateX(2px);
}

.action-patient {
    --quick-accent: #4e88b7;
    --quick-accent-soft: rgba(78,136,183,0.14);
    --quick-accent-strong: rgba(78,136,183,0.24);
}

.action-cabinet {
    --quick-accent: #4d8d87;
    --quick-accent-soft: rgba(77,141,135,0.15);
    --quick-accent-strong: rgba(77,141,135,0.24);
}

.action-reports {
    --quick-accent: #c2873f;
    --quick-accent-soft: rgba(194,135,63,0.15);
    --quick-accent-strong: rgba(194,135,63,0.24);
}

.action-schedule {
    --quick-accent: #7b73c6;
    --quick-accent-soft: rgba(123,115,198,0.15);
    --quick-accent-strong: rgba(123,115,198,0.24);
}

/* Empty State */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #8194a5;
    text-align: center;
}

.empty-state.small { padding: 28px 16px; }
.empty-state .empty-icon { font-size: 32px; margin-bottom: 8px; }
.empty-state p { font-size: 13px; font-weight: 500; }

/* ============================================================
   DASHBOARD PREMIUM v2 - Responsive
   ============================================================ */

@media (max-width: 1400px) {
    .dashboard-card-header { padding: 16px 18px; }
    .dashboard-card-body { padding: 16px 18px; }
    .mini-chart { height: 130px; padding: 0 18px 16px; }
    .appointment-item { padding: 14px 18px; }
    .collect-item { padding: 12px 18px; }
}

@media (max-width: 1200px) {
    .stats-premium-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-grid { grid-template-columns: 1.3fr 1fr; gap: 18px; }
}

@media (max-width: 1024px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .dashboard-col-side {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
    }
}

@media (max-width: 768px) {
    .dashboard-grid { gap: 14px; }
    .dashboard-col-side { grid-template-columns: 1fr; }
    .stats-premium-grid { gap: 12px; }
    .stat-premium-card { padding: 18px 20px; }
    .stat-premium-value { font-size: 26px; }
    .dashboard-card-header { padding: 14px 18px; flex-wrap: wrap; }
    .dashboard-card-body { padding: 14px 18px; }
    .appointment-item { padding: 12px 18px; }
    .collect-item { padding: 12px 18px; }
    .mini-chart { padding: 0 18px 16px; height: 120px; }
    .quick-actions-grid { padding: 0 18px 18px; gap: 8px; }
    .card-header-actions { flex-wrap: wrap; gap: 8px; }
}

@media (max-width: 600px) {
    .stats-premium-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .stat-premium-icon { width: 38px; height: 38px; border-radius: 10px; }
    .stat-premium-icon svg { width: 18px; height: 18px; }
    .stat-premium-value { font-size: 22px; }
    .stat-premium-label { font-size: 12px; }
    .stat-premium-trend { font-size: 10px; padding: 2px 6px; }
    .filter-select { font-size: 11px; padding: 5px 24px 5px 8px; max-width: 130px; }
    .status-filter-menu { width: min(460px, calc(100vw - 30px)); min-width: 0; }
    .status-filter-options { grid-template-columns: 1fr; }
    .status-multifilter-sidebar .status-filter-menu { width: min(420px, calc(100vw - 30px)); min-width: 0; }
    .appointment-status { font-size: 10px; padding: 3px 8px; }
    .status-filter-option { min-height: 60px; padding: 12px 14px; }
    .mini-chart { height: 110px; gap: 6px; }
    .chart-label { font-size: 10px; }
    .chart-bar-outer { max-width: 32px; }
    .quick-action { gap: 12px; padding: 15px 14px 15px 16px; min-height: 88px; }
    .quick-action::after { right: 12px; font-size: 14px; }
    .quick-action-icon { width: 40px; height: 40px; border-radius: 12px; }
    .quick-action-copy { gap: 3px; padding-right: 18px; }
    .quick-action-title { font-size: 13px; }
    .quick-action-sub { font-size: 11px; }
    .card-header-actions { gap: 6px; }
}

@media (max-width: 480px) {
    .stats-premium-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
    .stat-premium-card { padding: 14px; border-radius: 16px; }
    .stat-premium-top { flex-direction: column; gap: 8px; }
    .stat-premium-value { font-size: 20px; }
    .dashboard-card { border-radius: 16px; }
    .appointment-item { flex-wrap: wrap; gap: 10px; padding: 12px 14px; }
    .appointment-time { flex-direction: row; gap: 4px; min-width: unset; }
    .appointment-time .time-value { font-size: 13px; }
    .appointment-time .time-end::before { content: '–'; margin-right: 4px; }
    .appointment-indicator { width: 100%; height: 3px; order: -1; }
    .appointment-info { width: 100%; }
    .appointment-status { margin-left: auto; }
    .status-filter-menu { left: 0; right: auto; width: min(100vw - 24px, 420px); min-width: 0; }
    .status-filter-presets,
    .status-filter-footer { flex-direction: column; align-items: stretch; }
    .status-filter-apply { width: 100%; }
    .status-multifilter-sidebar .status-filter-menu { width: min(100vw - 24px, 420px); }
    .status-multifilter-sidebar .status-filter-options { grid-template-columns: 1fr; }
    .status-multifilter-sidebar .status-filter-presets { grid-template-columns: 1fr; }
    .status-multifilter-sidebar .status-filter-footer { grid-template-columns: 1fr; }
    .collect-item { flex-wrap: wrap; gap: 8px; padding: 12px 14px; }
    .collect-action { width: 100%; justify-content: space-between; }
    .quick-actions-grid { grid-template-columns: 1fr 1fr; gap: 6px; padding: 0 14px 14px; }
    .quick-action { gap: 10px; padding: 14px 12px 14px 14px; min-height: 82px; border-radius: 16px; }
    .quick-action::before { top: 12px; bottom: 12px; }
    .quick-action::after { right: 10px; font-size: 13px; }
    .quick-action-icon { width: 38px; height: 38px; }
    .quick-action-copy { padding-right: 16px; }
    .quick-action-sub { font-size: 10px; }
}

@media (max-width: 380px) {
    .stats-premium-grid { grid-template-columns: 1fr; gap: 8px; }
    .stat-premium-card { flex-direction: row; align-items: center; padding: 12px 14px; gap: 12px; }
    .stat-premium-top { margin-bottom: 0; }
    .stat-premium-value { font-size: 18px; }
}

/* Short height screens */
@media (max-height: 820px) {
    .appointments-list { max-height: clamp(220px, 40vh, 460px); }
    .collect-list { max-height: clamp(200px, 30vh, 320px); }
}


/* ============================================================
   SHARED PAGE HERO BANNER (used across all pages via page_hero_banner.php)
   ============================================================ */

/* ── Header Banner ── */
.cabinet-header-banner {
    position: relative;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat) 0%, var(--verde-albastrui-moderat) 50%, #5A9BA3 100%);
    border-radius: 24px;
    padding: 32px 36px;
    margin-bottom: 24px;
    overflow: hidden;
    box-shadow: 0 12px 48px rgba(52, 85, 93, 0.28);
}

/* Subtle grid mesh overlay */
.header-mesh {
    position: absolute;
    inset: 0;
    opacity: 0.04;
    background-image: 
        linear-gradient(rgba(255,255,255,1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,1) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
}

.cabinet-header-content {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.cabinet-header-text {
    display: flex;
    align-items: center;
    gap: 18px;
    color: white;
}

.mi-hero-back{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.14);color:white;border:1px solid rgba(255,255,255,0.22);border-radius:14px;text-decoration:none;backdrop-filter:blur(10px);transition:all .25s cubic-bezier(0.22,1,0.36,1);flex-shrink:0}
.mi-hero-back:hover{background:rgba(255,255,255,0.22);transform:translateY(-1px)}
.mi-hero-back svg{display:block}

/* Accessibility helper (screen-reader only) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.cabinet-header-icon {
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(12px);
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    flex-shrink: 0;
}

.cabinet-header-icon svg { color: white; }

.cabinet-title {
    font-size: 26px;
    font-weight: 800;
    margin: 0 0 4px 0;
    letter-spacing: -0.5px;
    line-height: 1.15;
}

.cabinet-subtitle {
    font-size: 14px;
    opacity: 0.88;
    margin: 0;
    font-weight: 400;
}

.cabinet-subtitle strong { opacity: 1; font-weight: 600; }

.cabinet-header-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.btn-cabinet {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    border-radius: 14px;
    font-size: 13.5px;
    font-weight: 600;
    font-family: inherit;
    border: none;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
    text-decoration: none;
    white-space: nowrap;
}

.btn-cabinet-primary {
    background: white;
    color: var(--albastru-verzui-moderat);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

.btn-cabinet-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

.btn-cabinet-secondary {
    background: rgba(255, 255, 255, 0.13);
    color: white;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.btn-cabinet-secondary:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-2px);
}

.cabinet-header-visual {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.header-circle {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.header-circle-1 {
    width: 350px;
    height: 350px;
    top: -120px;
    right: -60px;
    animation: headerOrb 15s ease-in-out infinite;
}

.header-circle-2 {
    width: 250px;
    height: 250px;
    bottom: -100px;
    left: 15%;
    animation: headerOrb 18s ease-in-out infinite reverse;
}

@keyframes headerOrb {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(20px, -15px); }
}

/* ── Shared Hero Responsive ── */
@media (max-width: 768px) {
    .cabinet-header-banner { padding: 24px 20px; border-radius: 20px; }
    .cabinet-title { font-size: 22px; }
    .cabinet-header-icon { width: 48px; height: 48px; border-radius: 14px; }
    .cabinet-header-actions { width: 100%; }
    .btn-cabinet { flex: 1; justify-content: center; padding: 11px 16px; font-size: 13px; }
}

@media (max-width: 480px) {
    .cabinet-header-banner { padding: 20px 16px; border-radius: 18px; }
    .cabinet-title { font-size: 20px; }
}


/* ============================================================
   CABINET ULTRA PREMIUM v3 - Compact Waiting Room
   ============================================================ */

.cabinet-premium {
    animation: cabPageIn 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes cabPageIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cabPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.8); }
}

@keyframes cabSlideUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Compact Hero Header ── */
.cab-hero {
    background: linear-gradient(135deg, #1E4D56 0%, var(--verde-albastrui-moderat, #517F89) 50%, #3A8A98 100%);
    border-radius: 18px;
    padding: 16px 22px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 18px;
    position: relative;
    overflow: hidden;
    animation: cabSlideUp 0.3s ease-out;
}

.cab-hero-mesh {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,0.07) 0%, transparent 70%);
    pointer-events: none;
}

.cab-hero-mesh-1 {
    width: 180px;
    height: 180px;
    top: -60px;
    right: -40px;
}

.cab-hero-mesh-2 {
    width: 120px;
    height: 120px;
    bottom: -50px;
    right: 120px;
}

.cab-hero-left {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.cab-hero-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(255,255,255,0.14);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cab-hero-icon svg {
    color: #fff;
}

.cab-hero-title-wrap {
    min-width: 0;
}

.cab-hero-title {
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -0.3px;
    margin: 0;
    line-height: 1.2;
}

.cab-hero-subtitle {
    color: rgba(255,255,255,0.58);
    font-size: 12px;
    font-weight: 500;
    margin: 2px 0 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px;
}

.cab-hero-subtitle strong {
    color: rgba(255,255,255,0.85);
    font-weight: 600;
}

/* Scope badges in hero */
.scope-badges {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.scope-label {
    font-size: 10px;
    font-weight: 600;
    color: rgba(255,255,255,0.4);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.scope-pill {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 6px;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.85);
    white-space: nowrap;
}

/* ── Inline mini-stats ── */
.cab-hero-stats {
    display: flex;
    gap: 6px;
    flex: 1;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.cab-mini-stat {
    background: rgba(255,255,255,0.10);
    backdrop-filter: blur(6px);
    border-radius: 10px;
    padding: 7px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(255,255,255,0.07);
    min-width: 90px;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.cab-mini-stat:hover {
    background: rgba(255,255,255,0.16);
    border-color: rgba(255,255,255,0.18);
    transform: translateY(-1px);
}

.cab-mini-stat.active {
    background: rgba(255,255,255,0.22);
    border-color: rgba(255,255,255,0.32);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08), 0 8px 18px rgba(0,0,0,0.10);
}

.cab-mini-stat:focus-visible {
    outline: 2px solid rgba(255,255,255,0.78);
    outline-offset: 3px;
}

.cab-mini-val {
    font-size: 20px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.cab-mini-val-gold { color: #E8A838; }
.cab-mini-val-purple { color: #7C5CBF; }
.cab-mini-val-green { color: #2EAE6A; }
.cab-mini-val-white { color: #fff; }

.cab-mini-label {
    font-size: 10px;
    color: rgba(255,255,255,0.50);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    line-height: 1.2;
}

/* ── Hero action buttons ── */
.cab-hero-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.btn-cab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px;
    border-radius: 10px;
    font-size: 12.5px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
    border: none;
    line-height: 1;
}

.btn-cab-ghost {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    backdrop-filter: blur(6px);
}

.btn-cab-ghost:hover {
    background: rgba(255,255,255,0.20);
    border-color: rgba(255,255,255,0.30);
}

.btn-cab-solid {
    background: rgba(255,255,255,0.94);
    color: #1E4D56;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.btn-cab-solid:hover {
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.18);
    transform: translateY(-1px);
}

/* ── Slim Filters Bar ── */
.cab-filters {
    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(12px);
    border-radius: 14px;
    padding: 8px 18px;
    margin-bottom: 16px;
    border: 1px solid rgba(81,127,137,0.08);
    animation: cabSlideUp 0.35s ease-out 0.05s both;
}

.cab-filters-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.cab-filter-group {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cab-filter-label {
    font-size: 10.5px;
    font-weight: 700;
    color: #8a9fa7;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.cab-filter-input,
.cab-filter-select {
    border: 1px solid rgba(81,127,137,0.16);
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: 500;
    color: var(--negru, #1a2b33);
    font-family: inherit;
    outline: none;
    background: rgba(81,127,137,0.04);
    transition: all 0.2s ease;
    min-width: 0;
}

.cab-filter-input:focus,
.cab-filter-select:focus {
    border-color: var(--verde-albastrui-moderat, #517F89);
    box-shadow: 0 0 0 3px rgba(81,127,137,0.10);
}

.cab-filter-sep {
    width: 1px;
    height: 22px;
    background: rgba(81,127,137,0.10);
    flex-shrink: 0;
}

.cab-filter-spacer {
    flex: 1;
}

.cab-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid rgba(81,127,137,0.14);
    background: transparent;
    color: var(--verde-albastrui-moderat, #517F89);
    font-weight: 600;
    font-size: 12px;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.cab-filter-btn:hover {
    background: rgba(81,127,137,0.08);
    border-color: rgba(81,127,137,0.22);
}

.cab-live {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: 4px;
}

.cab-live-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2EAE6A;
    animation: cabLivePulse 2s ease-in-out infinite;
}

@keyframes cabLivePulse {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(46,174,106,0.4); }
    50% { opacity: 0.6; box-shadow: 0 0 0 6px rgba(46,174,106,0); }
}

.cab-live-text {
    font-size: 11px;
    font-weight: 700;
    color: #2EAE6A;
    letter-spacing: 0.5px;
}

/* ── Content area ── */
.cab-content {
    /* noop wrapper */
}

/* ── Section headers ── */
.cab-section {
    margin-bottom: 18px;
}

.cab-section-animated {
    animation: cabSlideUp 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cab-section-header {
    margin-bottom: 10px;
}

.cab-section-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cab-pulse-ring {
    position: relative;
    width: 10px;
    height: 10px;
    flex-shrink: 0;
}

.cab-pulse-ring::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #7C5CBF;
    animation: cabPulse 2s ease-in-out infinite;
}

.cab-pulse-ring::after {
    content: '';
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: #7C5CBF;
}

.cab-section-label {
    font-size: 13px;
    font-weight: 700;
    color: #7C5CBF;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.cab-section-count {
    font-size: 12px;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 6px;
}

.cab-section-count.accent-purple {
    background: #7C5CBF;
    color: #fff;
}

/* ── Active patient card (horizontal, glassmorphism) ── */
.cab-active-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cab-active-card {
    background: linear-gradient(135deg, rgba(124,92,191,0.05) 0%, rgba(45,107,119,0.03) 100%);
    border: 1px solid rgba(124,92,191,0.16);
    border-radius: 16px;
    padding: 16px 20px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(12px);
    animation: cabSlideUp 0.4s ease-out;
    transition: box-shadow 0.2s;
}

.cab-active-card:hover {
    box-shadow: 0 4px 20px rgba(124,92,191,0.10);
}

.cab-active-accent {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #7C5CBF, #3A8A98);
    border-radius: 16px 0 0 16px;
}

.cab-active-card.priority-urgent .cab-active-accent {
    background: linear-gradient(180deg, #E05252, #c0392b);
}

.cab-active-card.priority-vip .cab-active-accent {
    background: linear-gradient(180deg, #D4A017, #E8A838);
}

.cab-active-avatar {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    background: linear-gradient(135deg, #7C5CBF, #3A8A98);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(124,92,191,0.22);
}

.cab-active-main {
    flex: 1;
    min-width: 0;
}

.cab-active-name-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.cab-active-pulse {
    position: relative;
    width: 8px;
    height: 8px;
    flex-shrink: 0;
}

.cab-active-pulse::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #7C5CBF;
    animation: cabPulse 2s ease-in-out infinite;
}

.cab-active-pulse::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 50%;
    background: #7C5CBF;
}

.cab-active-name {
    font-weight: 700;
    font-size: 15px;
    color: #1a2b33;
}

.cab-active-meta {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
    color: #64838c;
    margin-bottom: 5px;
}

.cab-meta-sep {
    color: #c0d0d5;
    font-weight: 400;
}

.cab-active-doctor-row {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
    color: #7a9199;
}

.cab-active-assistant-inline {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.cab-assistant-select-inline {
    border: 1px solid rgba(81,127,137,0.16);
    border-radius: 6px;
    padding: 2px 6px;
    font-size: 11.5px;
    font-family: inherit;
    background: rgba(81,127,137,0.04);
    color: var(--negru, #1a2b33);
    outline: none;
    cursor: pointer;
}

.cab-transfer-note {
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(243,156,18,0.08);
    color: #6b4f00;
    font-size: 12px;
    line-height: 1.35;
}

/* Active card right side */
.cab-active-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    flex-shrink: 0;
}

.cab-active-time {
    font-size: 22px;
    font-weight: 800;
    color: #1E4D56;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.cab-active-wait {
    font-size: 11px;
    color: #7C5CBF;
    font-weight: 600;
}

.cab-active-actions {
    display: flex;
    gap: 6px;
    margin-top: 4px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.btn-cab-action {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    white-space: nowrap;
    border: none;
}

.btn-cab-action-primary {
    background: linear-gradient(135deg, #7C5CBF, var(--verde-albastrui-moderat, #517F89));
    color: #fff;
    box-shadow: 0 2px 8px rgba(124,92,191,0.25);
}

.btn-cab-action-primary:hover {
    box-shadow: 0 4px 14px rgba(124,92,191,0.35);
    transform: translateY(-1px);
}

.btn-cab-action-ghost {
    background: rgba(81,127,137,0.06);
    border: 1px solid rgba(81,127,137,0.12);
    color: #64838c;
}

.btn-cab-action-ghost:hover {
    background: rgba(81,127,137,0.12);
    color: var(--verde-albastrui-moderat, #517F89);
}

/* ── Badges (shared) ── */
.cab-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 5px;
    letter-spacing: 0.4px;
    white-space: nowrap;
    line-height: 1.4;
}

.cab-badge-direct {
    background: rgba(46,174,106,0.12);
    color: #2EAE6A;
}

.cab-badge-transfer {
    background: rgba(232,168,56,0.12);
    color: #c78c20;
}

.cab-badge-status.cab-badge-scheduled {
    background: rgba(81,127,137,0.10);
    color: var(--verde-albastrui-moderat, #517F89);
}

.cab-badge-status.cab-badge-confirmed {
    background: rgba(46,174,106,0.10);
    color: #2EAE6A;
}

.cab-badge-status.cab-badge-waiting {
    background: rgba(232,168,56,0.12);
    color: #c78c20;
}

.cab-badge-status.cab-badge-inprogress {
    background: rgba(124,92,191,0.12);
    color: #7C5CBF;
}

.cab-badge-status.cab-badge-completed {
    background: rgba(46,174,106,0.12);
    color: #2EAE6A;
}

.cab-pay-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 5px;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

/* ── Queue panel (glassmorphism table) ── */
.cab-queue-panel {
    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(12px);
    border-radius: 16px;
    border: 1px solid rgba(81,127,137,0.08);
    overflow: hidden;
}

.cab-queue-header {
    padding: 12px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(81,127,137,0.08);
    flex-wrap: wrap;
}

.cab-queue-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cab-queue-title {
    font-size: 14px;
    font-weight: 700;
    color: #1a2b33;
}

.cab-queue-total {
    font-size: 12px;
    font-weight: 700;
    color: var(--verde-albastrui-moderat, #517F89);
    background: rgba(81,127,137,0.10);
    padding: 2px 8px;
    border-radius: 6px;
}

.cab-queue-total-green {
    color: #2EAE6A;
    background: rgba(46,174,106,0.12);
}

/* Queue filter chips */
.cabinet-queue-chips {
    display: flex;
    gap: 4px;
}

.cabinet-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 12px;
    border-radius: 8px;
    border: 1px solid transparent;
    background: transparent;
    color: #8a9fa7;
    font-weight: 600;
    font-size: 12px;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.cabinet-chip:hover {
    border-color: rgba(81,127,137,0.18);
}

.cabinet-chip.active {
    background: rgba(81,127,137,0.08);
    border-color: rgba(81,127,137,0.22);
    color: var(--verde-albastrui-moderat, #517F89);
}

.chip-count {
    font-size: 10.5px;
    font-weight: 700;
    opacity: 0.65;
}

.cabinet-chip.active .chip-count {
    opacity: 1;
}

/* Column headers */
.cab-queue-colheaders {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 18px;
    font-size: 10px;
    font-weight: 700;
    color: #a0b5bc;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    border-bottom: 1px solid rgba(81,127,137,0.05);
    background: rgba(81,127,137,0.02);
}

/* Column widths */
.cab-col-num { width: 24px; text-align: center; flex-shrink: 0; }
.cab-col-avatar { width: 38px; flex-shrink: 0; }
.cab-col-patient { flex: 2; min-width: 0; }
.cab-col-service { flex: 1.2; min-width: 0; }
.cab-col-doctor { width: 140px; flex-shrink: 0; }
.cab-col-pay { width: 60px; flex-shrink: 0; }
.cab-col-time { width: 60px; flex-shrink: 0; text-align: right; }
.cab-col-actions { width: auto; flex-shrink: 0; display: flex; gap: 5px; align-items: center; justify-content: flex-end; margin-left: auto; }

/* ── Queue row ── */
.cab-queue-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 18px;
    border-bottom: 1px solid rgba(81,127,137,0.05);
    transition: all 0.2s ease;
    cursor: default;
    border-left: 3px solid transparent;
    animation: cabSlideUp 0.35s ease-out both;
}

.cab-queue-row:nth-child(1) { animation-delay: 0s; }
.cab-queue-row:nth-child(2) { animation-delay: 0.04s; }
.cab-queue-row:nth-child(3) { animation-delay: 0.08s; }
.cab-queue-row:nth-child(4) { animation-delay: 0.12s; }
.cab-queue-row:nth-child(5) { animation-delay: 0.16s; }
.cab-queue-row:nth-child(n+6) { animation-delay: 0.2s; }

.cab-queue-row:last-child {
    border-bottom: none;
}

.cab-queue-row:hover {
    background: rgba(81,127,137,0.03);
}

.cab-queue-row.is-waiting {
    border-left-color: #E8A838;
}

.cab-queue-row.priority-urgent {
    border-left-color: #E05252;
}

.cab-queue-row.priority-vip {
    border-left-color: #D4A017;
}

.cab-queue-row.is-completed {
    border-left-color: #2EAE6A;
    background: rgba(46,174,106,0.025);
}

.cab-queue-row .cab-col-num {
    font-size: 11px;
    font-weight: 600;
    color: #b0c4cb;
}

/* Row avatar */
.cab-row-avatar {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(81,127,137,0.10), rgba(81,127,137,0.05));
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
    color: var(--verde-albastrui-moderat, #517F89);
    border: 1px solid rgba(81,127,137,0.12);
    flex-shrink: 0;
}

.cab-row-avatar.waiting {
    background: linear-gradient(135deg, rgba(232,168,56,0.12), rgba(232,168,56,0.05));
    color: #c78c20;
    border-color: rgba(232,168,56,0.20);
}

.cab-row-avatar.completed {
    background: linear-gradient(135deg, rgba(46,174,106,0.13), rgba(46,174,106,0.05));
    color: #2EAE6A;
    border-color: rgba(46,174,106,0.22);
}

/* Row patient info */
.cab-row-name-line {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.cab-row-name {
    font-weight: 600;
    font-size: 13.5px;
    color: #1a2b33;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cab-row-submeta {
    font-size: 11.5px;
    color: #8a9fa7;
    margin-top: 1px;
}

.cab-row-mobile-extra {
    display: none;
}

/* Row service */
.cab-row-service {
    font-size: 12.5px;
    color: #64838c;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Row doctor */
.cab-row-doctor {
    font-size: 12.5px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Row time */
.cab-row-time {
    font-size: 15px;
    font-weight: 700;
    color: #1E4D56;
    font-variant-numeric: tabular-nums;
}

.cab-row-wait {
    font-size: 10px;
    color: #E8A838;
    font-weight: 600;
}

.cab-row-done {
    color: #2EAE6A;
}

/* Row action buttons */
.btn-cab-row {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 11.5px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    text-decoration: none;
    border: none;
}

.btn-cab-row-primary {
    background: linear-gradient(135deg, var(--verde-albastrui-moderat, #517F89), #3A8A98);
    color: #fff;
    box-shadow: 0 2px 6px rgba(81,127,137,0.22);
}

.btn-cab-row-primary:hover {
    box-shadow: 0 3px 10px rgba(81,127,137,0.32);
    transform: translateY(-1px);
}

.btn-cab-row-secondary {
    background: rgba(81,127,137,0.08);
    border: 1px solid rgba(81,127,137,0.15);
    color: var(--verde-albastrui-moderat, #517F89);
}

.btn-cab-row-secondary:hover {
    background: rgba(81,127,137,0.14);
}

.btn-cab-row-ghost {
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid rgba(81,127,137,0.10);
    background: transparent;
    color: #8a9fa7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cab-row-ghost:hover {
    background: rgba(81,127,137,0.08);
    color: var(--verde-albastrui-moderat, #517F89);
}

/* Row inline form */
.cab-row-form {
    display: inline-flex;
    margin: 0;
    padding: 0;
}

/* Row inline assistant select */
.cab-row-assistant-sel {
    border: 1px solid rgba(81,127,137,0.14);
    border-radius: 6px;
    padding: 4px 6px;
    font-size: 11px;
    font-family: inherit;
    background: rgba(81,127,137,0.04);
    color: var(--negru, #1a2b33);
    outline: none;
    cursor: pointer;
    max-width: 100px;
    transition: border-color 0.2s;
}

.cab-row-assistant-sel:focus {
    border-color: var(--verde-albastrui-moderat, #517F89);
}

/* ── Empty states ── */
.cab-empty-state {
    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(16px);
    border: 1px dashed rgba(81,127,137,0.18);
    border-radius: 16px;
    padding: 44px 28px;
    text-align: center;
}

.cab-empty-state.small {
    padding: 24px 18px;
}

.cab-empty-icon { font-size: 38px; margin-bottom: 10px; }
.cab-empty-state.small .cab-empty-icon { font-size: 28px; margin-bottom: 6px; }
.cab-empty-title { font-size: 15px; font-weight: 700; color: var(--negru, #1a2b33); margin-bottom: 4px; }
.cab-empty-state.small .cab-empty-title { font-size: 14px; }
.cab-empty-text { font-size: 13px; color: #7a9199; }
.cab-empty-state.small .cab-empty-text { font-size: 12px; }

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

@media (max-width: 1200px) {
    .cab-hero {
        flex-wrap: wrap;
        gap: 12px;
    }
    .cab-hero-stats {
        order: 3;
        width: 100%;
        justify-content: flex-start;
    }
    .cab-hero-actions {
        margin-left: auto;
    }
}

@media (max-width: 900px) {
    .cab-hero {
        padding: 14px 16px;
    }
    .cab-mini-stat {
        padding: 6px 10px;
        min-width: 75px;
    }
    .cab-mini-val {
        font-size: 17px;
    }
    .cab-mini-label {
        font-size: 9px;
    }
    /* Hide service and doctor columns, show in mobile extra */
    .cab-queue-colheaders .cab-col-service,
    .cab-queue-colheaders .cab-col-doctor,
    .cab-queue-row .cab-col-service,
    .cab-queue-row .cab-col-doctor {
        display: none;
    }
    .cab-row-mobile-extra {
        display: flex;
        gap: 4px;
        align-items: center;
        font-size: 11px;
        color: #8a9fa7;
        margin-top: 2px;
    }
}

@media (max-width: 768px) {
    .cab-hero-title { font-size: 16px; }
    .cab-hero-icon { width: 38px; height: 38px; }
    .cab-hero-icon svg { width: 18px; height: 18px; }
    .btn-cab-text { display: none; }
    .btn-cab { padding: 9px 10px; }
    .cab-hero-actions { gap: 6px; }

    .cab-filters-inner {
        flex-wrap: wrap;
        gap: 8px;
    }
    .cab-filter-sep {
        display: none;
    }
    .cab-filter-spacer {
        display: none;
    }
    .cab-filter-btn {
        padding: 5px 10px;
        font-size: 11px;
    }

    /* Active card stacked */
    .cab-active-card {
        flex-direction: column;
        gap: 12px;
        padding: 14px 16px;
    }
    .cab-active-right {
        flex-direction: row;
        align-items: center;
        gap: 12px;
        width: 100%;
        justify-content: space-between;
    }
    .cab-active-actions {
        margin-top: 0;
    }

    /* Queue row stacked on mobile */
    .cab-queue-colheaders {
        display: none;
    }
    .cab-queue-row {
        flex-wrap: wrap;
        gap: 8px;
        padding: 12px 14px;
    }
    .cab-queue-row .cab-col-num { display: none; }
    .cab-queue-row .cab-col-service { display: none; }
    .cab-queue-row .cab-col-doctor { display: none; }
    .cab-queue-row .cab-col-pay { order: 5; }
    .cab-queue-row .cab-col-time { order: 4; }
    .cab-queue-row .cab-col-patient { flex: 1; }
    .cab-queue-row .cab-col-actions {
        width: 100%;
        order: 10;
        justify-content: flex-start;
        gap: 6px;
        padding-top: 6px;
        border-top: 1px solid rgba(81,127,137,0.06);
        margin-left: 0;
    }
    .cab-row-mobile-extra {
        display: flex;
    }
}

@media (max-width: 480px) {
    .cab-hero {
        padding: 12px 14px;
        border-radius: 14px;
    }
    .cab-hero-stats {
        gap: 4px;
        flex-wrap: wrap;
    }
    .cab-mini-stat {
        padding: 5px 8px;
        min-width: 68px;
        gap: 5px;
    }
    .cab-mini-val { font-size: 15px; }

    .cab-filters {
        padding: 6px 12px;
        border-radius: 10px;
    }

    .cab-queue-panel {
        border-radius: 12px;
    }

    .cab-active-card {
        border-radius: 12px;
        padding: 12px 14px;
    }
    .cab-active-avatar {
        width: 42px;
        height: 42px;
        font-size: 14px;
    }
    .cab-active-name { font-size: 14px; }
    .cab-active-time { font-size: 18px; }
    .btn-cab-action { padding: 6px 10px; font-size: 11px; }

    .cab-queue-header {
        padding: 10px 12px;
        flex-direction: column;
        align-items: flex-start;
    }
    .cabinet-queue-chips {
        width: 100%;
    }
    .cabinet-chip {
        flex: 1;
        justify-content: center;
        padding: 5px 8px;
        font-size: 11px;
    }
}

@media (max-width: 380px) {
    .cab-hero-left { gap: 8px; }
    .cab-hero-icon { width: 34px; height: 34px; border-radius: 10px; }
    .cab-hero-title { font-size: 15px; }
    .cab-hero-subtitle { font-size: 11px; max-width: 180px; }
    .cab-mini-stat { min-width: 60px; padding: 4px 6px; }
    .cab-mini-val { font-size: 14px; }
}

/* ============================================================
   CONSULTATION INTERFACE PREMIUM
   ============================================================ */

.consultation-workspace {
    animation: fadeIn 0.4s ease;
}

/* Consultation Header */
.consultation-header-premium {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    background: white;
    border-radius: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
    flex-wrap: wrap;
}

.consultation-header-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.patient-header-info {
    display: flex;
    align-items: center;
    gap: 14px;
}

.patient-avatar-header {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--verde-foarte-deschis), var(--gri-deschis));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    color: var(--albastru-verzui-moderat);
}

.patient-header-details h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 4px 0;
    color: var(--negru);
}

.patient-header-details span {
    font-size: 13px;
    color: var(--violet-cenusiu);
}

.consultation-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.header-badge {
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.badge-reg {
    background: rgba(81, 127, 137, 0.1);
    color: var(--verde-albastrui-moderat);
}

/* Consultation Tabs */
.consultation-tabs-container {
    background: white;
    border-radius: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
    overflow: hidden;
}

.consultation-tabs {
    display: flex;
    gap: 4px;
    padding: 16px 20px;
    background: var(--light-bg);
    border-bottom: 1px solid rgba(81, 127, 137, 0.1);
    overflow-x: auto;
}

.consultation-tab {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: white;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    color: var(--violet-cenusiu);
    cursor: pointer;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.consultation-tab:hover {
    background: rgba(81, 127, 137, 0.08);
    color: var(--albastru-verzui-moderat);
}

.consultation-tab.active {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    box-shadow: 0 4px 15px rgba(52, 85, 93, 0.25);
}

.consultation-tab i {
    font-size: 16px;
}

.tab-badge {
    padding: 2px 8px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
}

.consultation-tab:not(.active) .tab-badge {
    background: rgba(81, 127, 137, 0.15);
    color: var(--verde-albastrui-moderat);
}

.consultation-tabs-actions {
    padding: 12px 20px;
    display: flex;
    justify-content: flex-end;
}

.btn-finish-consultation {
    padding: 12px 24px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Tab Contents */
.consultation-tab-contents {
    padding: 0;
}

.tab-content {
    display: none;
    animation: fadeIn 0.3s ease;
}

.tab-content.active {
    display: block;
}

/* Patient Tab Premium */
.patient-tab-layout {
    display: grid;
    gap: 20px;
}

.patient-premium-card {
    padding: 20px;
    background: linear-gradient(135deg, rgba(189, 220, 219, 0.15) 0%, rgba(208, 219, 219, 0.1) 100%);
    border-radius: 16px;
    border: 1px solid rgba(81, 127, 137, 0.1);
}

.patient-premium-top {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.patient-avatar-mini {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    color: white;
    flex-shrink: 0;
}

.patient-premium-main { flex: 1; }
.patient-premium-name { font-size: 20px; font-weight: 700; color: var(--negru); margin-bottom: 4px; }
.patient-premium-sub { font-size: 13px; color: var(--violet-cenusiu); margin-bottom: 10px; }

.patient-premium-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 12px;
    background: color-mix(in srgb, var(--chip) 12%, transparent);
    color: var(--chip);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.patient-premium-stats {
    display: flex;
    gap: 24px;
}

.patient-premium-stats .stat {
    text-align: center;
}

.patient-premium-stats .v {
    font-size: 24px;
    font-weight: 800;
    color: var(--negru);
}

.patient-premium-stats .k {
    font-size: 11px;
    color: var(--violet-cenusiu);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.patient-premium-contacts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding-top: 16px;
    border-top: 1px solid rgba(81, 127, 137, 0.1);
}

.patient-premium-contacts .contact {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--negru);
}

.patient-premium-contacts .contact.full {
    grid-column: span 2;
}

.patient-premium-contacts .ico { font-size: 16px; }

.patient-allergies-inline {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: rgba(231, 76, 60, 0.08);
    border-radius: 12px;
    margin-top: 16px;
}

.allergy-title {
    font-size: 13px;
    font-weight: 600;
    color: #c0392b;
    white-space: nowrap;
}

.allergy-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.allergy-badge {
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}

.allergy-severe { background: rgba(231, 76, 60, 0.15); color: #c0392b; }
.allergy-moderate { background: rgba(243, 156, 18, 0.15); color: #d68910; }
.allergy-mild { background: rgba(46, 204, 113, 0.15); color: #27ae60; }

.patient-more-toggle {
    display: block;
    width: 100%;
    padding: 10px;
    margin-top: 12px;
    background: none;
    border: 1px dashed rgba(81, 127, 137, 0.3);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    color: var(--verde-albastrui-moderat);
    cursor: pointer;
    transition: all 0.2s ease;
}

.patient-more-toggle:hover {
    background: rgba(81, 127, 137, 0.05);
    border-color: var(--verde-albastrui-moderat);
}

.patient-more-box {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(81, 127, 137, 0.1);
}

.patient-row-two {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.doctor-info-box strong {
    font-size: 16px;
    color: var(--negru);
}

.consultation-info-box .info-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid rgba(81, 127, 137, 0.08);
}

.consultation-info-box .info-row:last-child { border-bottom: none; }
.consultation-info-box .info-row span { color: var(--violet-cenusiu); font-size: 13px; }
.consultation-info-box .info-row strong { color: var(--negru); font-size: 13px; }

/* Notes Tab Premium */
.notes-tab-layout .card {
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
}

.notes-tab-layout .form-group {
    margin-bottom: 20px;
}

.notes-tab-layout .form-label {
    font-weight: 600;
    color: var(--negru);
    margin-bottom: 8px;
}

.notes-tab-layout textarea {
    border-radius: 12px;
    border: 1px solid rgba(81, 127, 137, 0.2);
    padding: 14px;
    font-size: 14px;
    transition: all 0.2s ease;
}

.notes-tab-layout textarea:focus {
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81, 127, 137, 0.1);
}

/* Services Tab Premium */
.services-tab-new {
    padding: 0;
}

.services-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.services-left-column{
    display:flex;
    flex-direction:column;
    gap:14px;
}


.services-available-card .card,
.services-added-card .card {
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
    height: auto;
}

.services-search-box {
    margin-bottom: 16px;
}

.services-search-box input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid rgba(81, 127, 137, 0.2);
    border-radius: 12px;
    font-size: 14px;
}

.services-available-card .card-body{
    padding:14px;
}


.services-available-list {
    max-height: 280px;
    overflow-y: auto;
}

.services-added-list {
    max-height: 460px;
    overflow-y: auto;
}

.service-added-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--light-bg);
    border-radius: 12px;
    margin-bottom: 10px;
}

.service-added-info { flex: 1; }
.service-added-name { font-size: 14px; font-weight: 600; color: var(--negru); }
.service-added-qty { font-size: 12px; color: var(--violet-cenusiu); }
.service-added-notes { font-size: 11px; color: var(--violet-cenusiu); font-style: italic; display: block; margin-top: 2px; }
.service-added-price { font-size: 14px; font-weight: 700; color: var(--negru); }

.btn-remove-service {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(231, 76, 60, 0.1);
    border: none;
    color: #e74c3c;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s ease;
}

.btn-remove-service:hover {
    background: rgba(231, 76, 60, 0.2);
}

/* Documents Tab Premium */
.documents-tab-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
}

.documents-sidebar {
    background: white;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
}

.documents-sidebar h4 {
    font-size: 14px;
    font-weight: 700;
    color: var(--negru);
    margin: 0 0 6px 0;
}

.documents-sidebar-hint {
    font-size: 12px;
    color: var(--violet-cenusiu);
    margin-bottom: 16px;
}

.doc-type-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    background: var(--light-bg);
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    color: var(--violet-cenusiu);
    cursor: pointer;
    margin-bottom: 8px;
    transition: all 0.25s ease;
    text-align: left;
}

.doc-type-btn:hover {
    background: rgba(81, 127, 137, 0.1);
    color: var(--albastru-verzui-moderat);
}

.doc-type-btn.active {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(52, 85, 93, 0.25);
}

/* IMPORTANT: când butonul este selectat, forțăm textul și icon-ul pe alb
   (altfel regula .doc-type-btn span / icon poate suprascrie culoarea). */
.doc-type-btn.active span,
.doc-type-btn.active i {
    color: #fff;
}

.doc-type-btn i {
    font-size: 18px;
    width: 24px;
    text-align: center;
}

.documents-sidebar-section {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(81, 127, 137, 0.1);
}

.doc-type-btn.admin {
    background: rgba(243, 156, 18, 0.1);
    color: #d68910;
}

.doc-type-btn.admin:hover {
    background: rgba(243, 156, 18, 0.2);
}

.documents-main {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.documents-history-card {
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
}

.documents-form-card {
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
}

/* Responsive for consultation */
@media (max-width: 1100px) {
    .documents-tab-layout { grid-template-columns: 1fr; }
    .documents-sidebar { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px; }
    .documents-sidebar h4, .documents-sidebar-hint { width: 100%; }
    .doc-type-btn { flex: 1; min-width: 140px; justify-content: center; }
    .services-grid-layout { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .consultation-header-premium { flex-direction: column; align-items: stretch; }
    .consultation-header-left { flex-direction: column; align-items: flex-start; }
    .consultation-header-right { justify-content: flex-start; }
    .consultation-tabs { gap: 6px; padding: 12px 16px; }
    .consultation-tab { padding: 10px 14px; font-size: 13px; }
    .consultation-tab span { display: none; }
    .patient-row-two { grid-template-columns: 1fr; }
    .patient-premium-top { flex-direction: column; }
    .patient-premium-stats { margin-top: 16px; }
    .patient-premium-contacts { grid-template-columns: 1fr; }
    .patient-premium-contacts .contact.full { grid-column: span 1; }
}

/* ============================================================
   CONSULTATION PREMIUM - Additional Elements
   ============================================================ */

/* Back Button Premium */
.btn-back-premium {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--light-bg);
    border: 1px solid rgba(81, 127, 137, 0.15);
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--violet-cenusiu);
    text-decoration: none;
    transition: all 0.25s ease;
}

.btn-back-premium:hover {
    background: rgba(81, 127, 137, 0.1);
    color: var(--albastru-verzui-moderat);
    transform: translateX(-3px);
}

.btn-back-premium svg {
    transition: transform 0.25s ease;
}

.btn-back-premium:hover svg {
    transform: translateX(-3px);
}

/* Avatar Active State */
.patient-avatar-header {
    position: relative;
}

.patient-avatar-header.active {
    background: linear-gradient(135deg, #9b59b6, #8e44ad);
}

.avatar-pulse {
    position: absolute;
    inset: -4px;
    border-radius: 20px;
    border: 2px solid #9b59b6;
    animation: avatar-pulse-anim 2s infinite;
}

@keyframes avatar-pulse-anim {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 0; transform: scale(1.15); }
}

/* Finish Button Premium */
.btn-finish-premium {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #27ae60, #2ecc71);
    border: none;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 700;
    font-family: inherit;
    color: white;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(39, 174, 96, 0.35);
    transition: all 0.3s ease;
}

.btn-finish-premium:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(39, 174, 96, 0.45);
}

.btn-finish-premium:active {
    transform: translateY(0);
}

/* Header Badge Enhanced */
.header-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.header-badge svg {
    opacity: 0.7;
}

/* Consultation Tabs Enhanced */
.consultation-tab svg {
    flex-shrink: 0;
}

.consultation-tab.active svg {
    color: white;
}

/* Tab Content Cards */
.tab-content .card {
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(52, 85, 93, 0.08);
    border: none;
    overflow: hidden;
}

.tab-content .card-header {
    background: linear-gradient(135deg, rgba(189, 220, 219, 0.2) 0%, rgba(208, 219, 219, 0.1) 100%);
    border-bottom: 1px solid rgba(81, 127, 137, 0.1);
    padding: 18px 24px;
}

.tab-content .card-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--negru);
    display: flex;
    align-items: center;
    gap: 10px;
}

.tab-content .card-body {
    padding: 24px;
}

/* Form Elements Premium */
.tab-content .form-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--negru);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.tab-content .form-control {
    border-radius: 12px;
    border: 1px solid rgba(81, 127, 137, 0.2);
    padding: 12px 16px;
    font-size: 14px;
    transition: all 0.2s ease;
}

.tab-content .form-control:focus {
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81, 127, 137, 0.1);
    outline: none;
}

.tab-content textarea.form-control {
    resize: vertical;
    min-height: 100px;
}

/* Form Actions Premium */
.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid rgba(81, 127, 137, 0.1);
}

.form-actions .btn {
    padding: 12px 24px;
    border-radius: 12px;
    font-weight: 600;
}

/* Documents History Premium */
.documents-history-list {
    max-height: 400px;
    overflow-y: auto;
}

.history-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    background: var(--light-bg);
    border-radius: 12px;
    margin-bottom: 10px;
    transition: all 0.2s ease;
}

.history-item:hover {
    background: rgba(81, 127, 137, 0.1);
}

.history-item-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.history-item-icon.letter { background: rgba(52, 152, 219, 0.12); color: #3498db; }
.history-item-icon.referral { background: rgba(155, 89, 182, 0.12); color: #9b59b6; }
.history-item-icon.certificate { background: rgba(39, 174, 96, 0.12); color: #27ae60; }
.history-item-icon.note { background: rgba(243, 156, 18, 0.12); color: #f39c12; }
.history-item-icon.echo { background: rgba(231, 76, 60, 0.12); color: #e74c3c; }

.history-item-info { flex: 1; min-width: 0; }
.history-item-title { font-size: 14px; font-weight: 600; color: var(--negru); }
.history-item-meta { font-size: 12px; color: var(--violet-cenusiu); margin-top: 2px; }

.history-item-actions {
    display: flex;
    gap: 8px;
}

.history-item-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.history-item-btn.view { background: rgba(52, 152, 219, 0.1); color: #3498db; }
.history-item-btn.edit { background: rgba(243, 156, 18, 0.1); color: #f39c12; }
.history-item-btn.delete { background: rgba(231, 76, 60, 0.1); color: #e74c3c; }

.history-item-btn:hover {
    transform: scale(1.1);
}

/* Services Premium */
.service-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--light-bg);
    border-radius: 12px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.service-item:hover {
    background: rgba(81, 127, 137, 0.12);
    transform: translateX(4px);
}

.service-item-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--verde-foarte-deschis), var(--gri-deschis));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.service-item-info { flex: 1; }
.service-item-name { font-size: 14px; font-weight: 600; color: var(--negru); }
.service-item-category { font-size: 12px; color: var(--violet-cenusiu); }
.service-item-price { font-size: 14px; font-weight: 700; color: var(--negru); }

/* Empty State Premium */
.empty-state-small {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
    color: var(--violet-cenusiu);
}

.empty-state-small i {
    font-size: 40px;
    margin-bottom: 12px;
    opacity: 0.5;
}

/* Doctor Info Box Premium */
.doctor-info-box {
    padding: 16px;
    background: linear-gradient(135deg, rgba(81, 127, 137, 0.08) 0%, rgba(81, 127, 137, 0.04) 100%);
    border-radius: 14px;
}

.doctor-info-box strong {
    display: block;
    font-size: 16px;
    color: var(--negru);
    margin-bottom: 6px;
}

/* Consultation Info Box Premium */
.consultation-info-box {
    padding: 4px;
}

/* Patient Details Grid Compact */
.patient-details-grid.compact {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.patient-details-grid .detail-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.patient-details-grid .detail-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--violet-cenusiu);
}

.patient-details-grid .detail-value {
    font-size: 14px;
    font-weight: 600;
    color: var(--negru);
}

/* Services Total Premium */
.services-total-new {
    padding: 16px;
    background: linear-gradient(135deg, rgba(39, 174, 96, 0.08) 0%, rgba(39, 174, 96, 0.04) 100%);
    border-radius: 14px;
    margin-top: 16px;
}

.services-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.services-total-row.main {
    font-size: 18px;
    font-weight: 700;
    color: var(--negru);
    border-top: 2px solid rgba(39, 174, 96, 0.2);
    padding-top: 12px;
    margin-top: 8px;
}

/* Badge Count Premium */
.badge-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 8px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    border-radius: 12px;
    font-size: 12px;
    font-weight: 700;
    color: white;
}

/* ============================================================
   CONSULTATION PREMIUM 2-COLUMN LAYOUT
   ============================================================ */

.consultation-premium-container {
    max-width: 1600px;
    margin: 0 auto;
    animation: fadeIn 0.5s ease-out;
}

/* Premium Header */
.consultation-header-new {
    background: var(--surface-strong);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 20px 28px;
    margin-bottom: 20px;
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.header-left-new {
    display: flex;
    align-items: center;
    gap: 16px;
}

.btn-back-new {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--surface-soft);
    border: 1px solid var(--border-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--violet-cenusiu);
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

.btn-back-new:hover {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    transform: translateX(-4px);
    box-shadow: var(--shadow-soft);
    text-decoration: none;
}

.consultation-title-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.consultation-title-block h1 {
    font-size: 1.4rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
}

.consultation-title-block .subtitle {
    font-size: 0.85rem;
    color: var(--violet-cenusiu);
    display: flex;
    align-items: center;
    gap: 8px;
}

.consultation-id-badge {
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.1) 0%, rgba(81, 127, 137, 0.1) 100%);
    padding: 4px 12px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--verde-albastrui-moderat);
}

.header-actions-new {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.consultation-header-registry {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 22px;
    min-height: 62px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.08) 0%, rgba(81, 127, 137, 0.10) 100%);
    border: 1px solid rgba(81, 127, 137, 0.18);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
    flex: 1 1 280px;
}

.consultation-header-registry .registry-label {
    font-size: 1rem;
    font-weight: 700;
    color: var(--violet-cenusiu);
    letter-spacing: 0.01em;
}

.consultation-header-registry .registry-value {
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1;
    color: var(--verde-albastrui-moderat);
    letter-spacing: 0.01em;
}

.status-badge-new {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 0.85rem;
}

.status-badge-new.in-progress {
    background: linear-gradient(135deg, rgba(243, 156, 18, 0.12) 0%, rgba(251, 191, 36, 0.12) 100%);
    color: #b45309;
    border: 1px solid rgba(243, 156, 18, 0.25);
}

.status-badge-new.waiting {
    background: linear-gradient(135deg, rgba(52, 152, 219, 0.12) 0%, rgba(41, 128, 185, 0.12) 100%);
    color: #1565c0;
    border: 1px solid rgba(52, 152, 219, 0.25);
}

.status-badge-new.completed {
    background: linear-gradient(135deg, rgba(39, 174, 96, 0.12) 0%, rgba(46, 204, 113, 0.12) 100%);
    color: #047857;
    border: 1px solid rgba(39, 174, 96, 0.25);
}

.status-badge-new i, .status-badge-new svg {
    font-size: 0.75rem;
    width: 14px;
    height: 14px;
}

.btn-header {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    text-decoration: none;
}

.btn-header-secondary {
    background: var(--surface-soft);
    color: var(--negru);
    border: 1px solid var(--border-soft);
}

.btn-header-secondary:hover {
    background: var(--surface-strong);
    border-color: var(--verde-albastrui-moderat);
    color: var(--verde-albastrui-moderat);
    text-decoration: none;
}

.btn-header-primary {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    box-shadow: 0 4px 14px rgba(52, 85, 93, 0.25);
}

.btn-header-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(52, 85, 93, 0.35);
    text-decoration: none;
    color: white;
}

/* 2-Column Layout (cu toggle sidebar) */
.consultation-layout-2col {
    display: grid;
    grid-template-columns: 360px 22px 1fr;
    gap: 0;
    align-items: start;
}

.consultation-layout-2col.sidebar-collapsed {
    grid-template-columns: 0 22px 1fr;
}

.consultation-layout-2col.sidebar-collapsed .sidebar-column {
    width: 0;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.consultation-sidebar-handle {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 12px;
}

@media (min-width: 1101px) {
    .consultation-sidebar-handle {
        position: sticky;
        top: 96px;
        height: fit-content;
        z-index: 20;
    }
}

.consult-sidebar-toggle {
    width: 42px;
    height: 78px;
    border-radius: 20px;
    border: 1px solid rgba(52,85,93,0.30);
    background: linear-gradient(180deg, #5c8d97 0%, #517f89 45%, #34555d 100%);
    box-shadow:
        0 14px 32px rgba(52,85,93,0.24),
        0 0 0 4px rgba(255,255,255,0.72);
    color: #ffffff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.consult-sidebar-toggle::before {
    content: '';
    position: absolute;
    inset: 5px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0.03));
    pointer-events: none;
}

.consult-sidebar-toggle:hover {
    transform: translateY(-1px);
    border-color: rgba(81,127,137,0.28);
    background: linear-gradient(180deg, #ffffff 0%, #f4fbfb 52%, #dfeded 100%);
    color: var(--albastru-verzui-moderat);
    box-shadow:
        0 14px 32px rgba(52,85,93,0.20),
        0 0 0 4px rgba(255,255,255,0.72);
}

.consult-sidebar-toggle:focus-visible {
    outline: none;
    border-color: rgba(52,85,93,0.36);
    background: linear-gradient(180deg, #5c8d97 0%, #517f89 45%, #34555d 100%);
    color: #ffffff;
    box-shadow:
        0 0 0 4px rgba(255,255,255,0.78),
        0 0 0 7px rgba(81,127,137,0.22),
        0 14px 32px rgba(52,85,93,0.26);
}

.consult-sidebar-toggle svg {
    position: relative;
    z-index: 1;
    width: 22px;
    height: 22px;
    stroke-width: 3;
    transition: transform 0.2s ease;
}

.consultation-layout-2col.sidebar-collapsed .consult-sidebar-toggle svg {
    transform: rotate(180deg);
}

@media (max-width: 1100px) {
    .consultation-layout-2col {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .consultation-sidebar-handle {
        display: none;
    }
}

.sidebar-column {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

@media (min-width: 1101px) {
    .sidebar-column {
        position: relative;
        top: 0;
        max-height: none;
        overflow: visible;
        padding-right: 10px;
        padding-bottom: 20px;
    }
}

/* Patient Card Premium */
.patient-card-premium {
    background: var(--surface-strong);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

/* IMPORTANT: stilurile de mai jos sunt DOAR pentru cardul premium din pagina de consultație
   (altfel suprascriu cardurile din Cabinet / Waiting). */
.patient-card-premium .patient-card-header {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    padding: 24px;
    position: relative;
    overflow: hidden;
}

.patient-card-premium .patient-card-header::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -50%;
    width: 100%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 60%);
}

.patient-avatar-large {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    color: white;
    font-weight: 700;
    margin-bottom: 14px;
    border: 3px solid rgba(255, 255, 255, 0.25);
    position: relative;
    z-index: 1;
}

.patient-name-large {
    font-size: 1.25rem;
    font-weight: 700;
    color: white;
    margin-bottom: 4px;
    position: relative;
    z-index: 1;
}

.patient-cnp-display {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.8);
    position: relative;
    z-index: 1;
}

.patient-card-premium .patient-card-body {
    padding: 18px 18px 20px;
}

.patient-card-premium,
.doctor-card-premium {
    overflow: visible;
}

.info-section-premium {
    margin-bottom: 14px;
}

.info-section-premium:last-child {
    margin-bottom: 0;
}

.info-section-title {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--violet-cenusiu);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.info-section-title svg {
    color: var(--verde-albastrui-moderat);
    width: 16px;
    height: 16px;
}

.info-grid-premium {
    display: grid;
    gap: 10px;
}

.info-item-premium {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 74px;
    padding: 12px 14px;
    background: var(--surface-soft);
    border-radius: 14px;
    border: 1px solid var(--border-soft);
    transition: all 0.25s ease;
}

.info-item-premium:hover {
    border-color: var(--verde-albastrui-moderat);
    transform: translateX(4px);
}

.info-icon-premium {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.1) 0%, rgba(81, 127, 137, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--verde-albastrui-moderat);
    flex-shrink: 0;
}

.info-icon-premium svg {
    width: 16px;
    height: 16px;
}

.info-content-premium {
    flex: 1;
    min-width: 0;
}

.info-label-premium {
    font-size: 0.7rem;
    color: var(--violet-cenusiu);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.info-value-premium {
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--negru);
    margin-top: 4px;
    word-break: break-word;
}

/* Alert Tags */
.alert-tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.alert-tag {
    padding: 6px 12px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

.alert-tag.danger {
    background: linear-gradient(135deg, rgba(231, 76, 60, 0.12) 0%, rgba(192, 57, 43, 0.12) 100%);
    color: #b91c1c;
    border: 1px solid rgba(231, 76, 60, 0.25);
}

.alert-tag.warning {
    background: linear-gradient(135deg, rgba(243, 156, 18, 0.12) 0%, rgba(230, 126, 34, 0.12) 100%);
    color: #b45309;
    border: 1px solid rgba(243, 156, 18, 0.25);
}

.alert-tag.info {
    background: linear-gradient(135deg, rgba(52, 152, 219, 0.12) 0%, rgba(41, 128, 185, 0.12) 100%);
    color: #1d4ed8;
    border: 1px solid rgba(52, 152, 219, 0.25);
}

/* Doctor Card Premium */
.doctor-card-premium {
    background: var(--surface-strong);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
    padding: 20px;
}

.doctor-card-title {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--violet-cenusiu);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.doctor-card-title svg {
    color: var(--verde-albastrui-moderat);
    width: 16px;
    height: 16px;
}

.doctor-info-block {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.06) 0%, rgba(81, 127, 137, 0.04) 100%);
    border-radius: 14px;
    border: 1px solid var(--border-soft);
    margin-bottom: 16px;
}

.doctor-avatar-premium {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.2rem;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(52, 85, 93, 0.25);
}

.doctor-details-premium {
    flex: 1;
    min-width: 0;
}

.doctor-name-premium {
    font-size: 1rem;
    font-weight: 700;
    color: var(--negru);
    margin-bottom: 2px;
}

.doctor-specialty-premium {
    font-size: 0.8rem;
    color: var(--verde-albastrui-moderat);
    font-weight: 600;
    margin-bottom: 2px;
}

.doctor-code-premium {
    font-size: 0.75rem;
    color: var(--violet-cenusiu);
}

.assistant-section-premium {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.assistant-label-premium {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--violet-cenusiu);
    display: flex;
    align-items: center;
    gap: 6px;
}

.assistant-label-premium svg {
    color: var(--verde-albastrui-moderat);
    width: 14px;
    height: 14px;
}

.select-wrapper-premium {
    position: relative;
}

.select-premium {
    width: 100%;
    padding: 12px 40px 12px 14px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface);
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--negru);
    cursor: pointer;
    appearance: none;
    transition: all 0.25s ease;
    font-family: inherit;
}

.select-premium:focus {
    outline: none;
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81, 127, 137, 0.1);
}

.select-premium:hover {
    border-color: var(--verde-albastrui-moderat);
}

.select-icon-premium {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--verde-albastrui-moderat);
    pointer-events: none;
}

.select-icon-premium svg {
    width: 16px;
    height: 16px;
}

/* Main Content Area */
.main-content-premium {
    min-width: 0;
}

.consult-top-actions-hero {
    margin-bottom: 14px;
    padding: 18px 18px 16px;
    border-radius: 20px;
    border: 1px solid rgba(81, 127, 137, 0.18);
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.96) 0%, rgba(81, 127, 137, 0.96) 55%, rgba(111, 150, 158, 0.94) 100%);
    box-shadow: 0 14px 32px rgba(52, 85, 93, 0.16);
    color: #fff;
}

.consult-top-actions-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.consult-top-actions-title {
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.2px;
}

.consult-top-actions-subtitle {
    max-width: 720px;
    font-size: 0.86rem;
    color: rgba(255, 255, 255, 0.82);
}

.consult-top-actions-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.consult-top-action {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 72px;
    padding: 14px 15px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.10);
    color: #fff;
    text-decoration: none;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
    backdrop-filter: blur(6px);
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.consult-top-action:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 10px 24px rgba(20, 40, 45, 0.16);
    color: #fff;
    text-decoration: none;
}

.consult-top-action-ico {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(255,255,255,0.14);
    border: 1px solid rgba(255,255,255,0.12);
}

.consult-top-action-ico svg {
    width: 18px;
    height: 18px;
}

.consult-top-action-text {
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.2;
}

.consult-top-action-sub {
    margin-top: 3px;
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.78);
}

@media (max-width: 1200px) {
    .consult-top-actions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .consult-top-actions-hero {
        padding: 16px 14px 14px;
        border-radius: 18px;
    }
    .consult-top-actions-head {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 12px;
    }
    .consult-top-actions-grid {
        grid-template-columns: 1fr;
    }
    .consult-top-action {
        min-height: 64px;
    }
}

/* Tabs Container Premium */
.tabs-container-premium {
    background: var(--surface-strong);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

.tabs-header-premium {
    display: flex;
    background: linear-gradient(180deg, rgba(52, 85, 93, 0.04) 0%, transparent 100%);
    border-bottom: 1px solid var(--border-soft);
    overflow-x: auto;
    scrollbar-width: none;
}

.tabs-header-premium::-webkit-scrollbar {
    display: none;
}

.tab-btn-premium {
    flex: 1;
    min-width: 160px;
    padding: 18px 24px;
    background: transparent;
    border: none;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--violet-cenusiu);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;
    transition: all 0.25s ease;
    font-family: inherit;
}

.tab-btn-premium::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    border-radius: 3px 3px 0 0;
    transition: width 0.25s ease;
}

.tab-btn-premium:hover {
    color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.04);
}

.tab-btn-premium.active {
    color: var(--verde-albastrui-moderat);
    background: rgba(81, 127, 137, 0.06);
}

.tab-btn-premium.active::after {
    width: 60%;
}

.tab-icon-premium {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-soft);
    border: 1px solid var(--border-soft);
    transition: all 0.25s ease;
}

.tab-icon-premium svg {
    width: 18px;
    height: 18px;
}

.tab-btn-premium.active .tab-icon-premium {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    border-color: transparent;
    box-shadow: 0 4px 12px rgba(52, 85, 93, 0.25);
}

.tab-badge-premium {
    position: absolute;
    top: 10px;
    right: 18px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 50px;
    background: var(--danger);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tab Content Premium */
.tabs-content-premium {
    padding: 24px;
}

.tab-panel-premium {
    display: none;
    animation: fadeIn 0.35s ease-out;
}

.tab-panel-premium.active {
    display: block;
}

/* Note Cards Premium */
.notes-grid-premium {
    display: grid;
    gap: 20px;
}

.note-card-premium {
    background: var(--surface-soft);
    border-radius: 16px;
    border: 1px solid var(--border-soft);
    padding: 20px;
    transition: all 0.25s ease;
}

.note-card-premium:hover {
    border-color: var(--verde-albastrui-moderat);
    box-shadow: var(--shadow-soft);
}

.note-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.note-card-title-premium {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--negru);
}

.note-card-title-premium .icon-wrap {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.note-card-title-premium .icon-wrap svg {
    width: 16px;
    height: 16px;
}

.note-textarea-premium {
    width: 100%;
    min-height: 120px;
    padding: 14px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-strong);
    font-size: 0.9rem;
    color: var(--negru);
    resize: vertical;
    transition: all 0.25s ease;
    font-family: inherit;
    line-height: 1.6;
}

.note-textarea-premium:focus {
    outline: none;
    border-color: var(--verde-albastrui-moderat);
    box-shadow: 0 0 0 3px rgba(81, 127, 137, 0.1);
}

.note-textarea-premium::placeholder {
    color: var(--violet-cenusiu);
}

/* Form Actions Premium */
.form-actions-premium {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid var(--border-soft);
}

/* Quick Actions Grid Premium */
.quick-actions-grid-premium {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}

.quick-action-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 18px 14px;
    background: var(--surface-soft);
    border-radius: 14px;
    border: 1px solid var(--border-soft);
    cursor: pointer;
    transition: all 0.25s ease;
    text-decoration: none;
    color: var(--negru);
    text-align: center;
}

.quick-action-item:hover {
    border-color: var(--verde-albastrui-moderat);
    transform: translateY(-4px);
    box-shadow: var(--shadow-soft);
    text-decoration: none;
    color: var(--negru);
}

.quick-action-item .icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.1) 0%, rgba(81, 127, 137, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--verde-albastrui-moderat);
    transition: all 0.25s ease;
}

.quick-action-item:hover .icon {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: white;
}

.quick-action-item .icon svg {
    width: 20px;
    height: 20px;
}

.quick-action-item span {
    font-size: 0.8rem;
    font-weight: 600;
}

/* Consultation Info Mini */
.consultation-info-mini {
    padding: 14px;
    background: var(--surface-soft);
    border-radius: 12px;
    border: 1px solid var(--border-soft);
}

.info-row-mini {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-soft);
}

.info-row-mini:last-child {
    border-bottom: none;
}

.info-row-mini span {
    font-size: 0.8rem;
    color: var(--violet-cenusiu);
}

.info-row-mini strong {
    font-size: 0.85rem;
    color: var(--negru);
}

/* Responsive */
@media (max-width: 768px) {
    .consultation-header-new {
        padding: 16px;
    }

    .header-left-new {
        flex-direction: column;
        align-items: flex-start;
    }

    .consultation-header-registry {
        width: 100%;
        justify-content: flex-start;
    }

    .consultation-header-registry .registry-label {
        font-size: 0.95rem;
    }

    .consultation-header-registry .registry-value {
        font-size: 1.35rem;
    }

    .consultation-layout-2col {
        gap: 16px;
    }

    .tabs-header-premium {
        padding: 0 8px;
    }

    .tab-btn-premium {
        min-width: 130px;
        padding: 14px 12px;
        flex-direction: column;
        gap: 6px;
        font-size: 0.8rem;
    }

    .tabs-content-premium {
        padding: 16px;
    }

    /* doar pentru cardul premium din consultație */
    .patient-card-premium .patient-card-header {
        padding: 20px;
    }

    .quick-actions-grid-premium {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* ============================================================
   PROVIDER - UI premium (Setări → Detalii furnizor)
   ============================================================ */

/* ============================================================
   DETALII FURNIZOR — PREMIUM DESIGN (dp-*)
   ============================================================ */
.dp-page{ max-width:1400px; margin:0 auto; animation:dpFadeIn .4s ease; }
@keyframes dpFadeIn{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

/* Header */
.dp-header{
    display:flex; align-items:center; justify-content:space-between;
    padding-bottom:24px; border-bottom:1px solid rgba(209,213,219,0.5);
    margin-bottom:24px; flex-wrap:wrap; gap:16px;
}
.dp-header-left{ display:flex; align-items:center; gap:16px; }
.dp-header-icon{
    width:56px; height:56px; border-radius:16px;
    background:linear-gradient(135deg, var(--albastru-verzui-moderat, #34555D), var(--verde-albastrui-moderat, #517F89));
    display:flex; align-items:center; justify-content:center;
    color:#fff; box-shadow:0 4px 16px rgba(81,127,137,.3); flex-shrink:0;
}
.dp-header-text h1{ font-size:1.75rem; font-weight:800; color:var(--text, #333); margin:0; }
.dp-header-text p{ font-size:.9rem; color:var(--violet-cenusiu, #6B7B8A); margin:4px 0 0; }
.dp-header-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.dp-btn-save{
    display:inline-flex; align-items:center; gap:8px;
    padding:12px 28px; border-radius:12px; font-size:.9rem; font-weight:700;
    background:linear-gradient(135deg, var(--albastru-verzui-moderat, #34555D), var(--verde-albastrui-moderat, #517F89));
    color:#fff; border:none; cursor:pointer; font-family:inherit;
    box-shadow:0 4px 16px rgba(81,127,137,.3); transition:all .25s ease;
}
.dp-btn-save:hover{ transform:translateY(-2px); box-shadow:0 6px 24px rgba(81,127,137,.4); }
.dp-btn-save-sm{ padding:10px 20px; font-size:.85rem; }

.dp-btn-secondary{
    display:inline-flex; align-items:center; gap:8px;
    padding:12px 20px; border-radius:12px; font-size:.9rem; font-weight:600;
    background:rgba(255,255,255,0.95); color:var(--violet-cenusiu, #6B7B8A);
    border:2px solid rgba(209,213,219,0.5); cursor:pointer; font-family:inherit;
    transition:all .25s ease;
}
.dp-btn-secondary:hover{ border-color:var(--verde-albastrui-moderat, #517F89); color:var(--verde-albastrui-moderat, #517F89); }

/* Main layout */
.dp-layout{
    display:grid; grid-template-columns:1fr 380px;
    gap:24px; align-items:start;
}

/* Section cards */
.dp-section{
    background:rgba(255,255,255,0.95); backdrop-filter:blur(20px);
    border-radius:20px; border:1px solid rgba(209,213,219,0.5);
    overflow:hidden; margin-bottom:20px; transition:all .3s ease;
}
.dp-section:hover{ box-shadow:0 8px 32px rgba(0,0,0,.06); }

.dp-section-header{
    display:flex; align-items:center; gap:14px;
    padding:18px 24px;
    background:linear-gradient(180deg, rgba(189,220,219,.08) 0, transparent 100%);
    border-bottom:1px solid rgba(209,213,219,0.5);
    cursor:pointer; user-select:none; transition:background .2s ease;
}
.dp-section-header:hover{ background:rgba(189,220,219,.12); }

.dp-section-icon{
    width:42px; height:42px; border-radius:12px;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.dp-section-icon.teal{ background:linear-gradient(135deg, rgba(81,127,137,.15), rgba(81,127,137,.25)); color:var(--verde-albastrui-moderat, #517F89); }
.dp-section-icon.blue{ background:linear-gradient(135deg, rgba(52,152,219,.15), rgba(52,152,219,.25)); color:#3498DB; }
.dp-section-icon.amber{ background:linear-gradient(135deg, rgba(243,156,18,.12), rgba(243,156,18,.22)); color:#F39C12; }
.dp-section-icon.green{ background:linear-gradient(135deg, rgba(39,174,96,.12), rgba(39,174,96,.22)); color:#27AE60; }

.dp-section-info{ flex:1; }
.dp-section-title{ font-size:1rem; font-weight:700; color:var(--text, #333); }
.dp-section-desc{ font-size:.8rem; color:var(--violet-cenusiu, #6B7B8A); margin-top:2px; }

.dp-section-chevron{
    width:32px; height:32px; border-radius:8px;
    display:flex; align-items:center; justify-content:center;
    color:var(--violet-cenusiu, #6B7B8A); transition:all .3s ease;
}
.dp-section.collapsed .dp-section-chevron{ transform:rotate(-90deg); }

.dp-section-body{
    padding:24px; overflow:hidden;
    max-height:2000px; transition:max-height .4s ease, padding .35s ease, opacity .3s ease;
    opacity:1;
}
.dp-section.collapsed .dp-section-body{
    max-height:0; padding-top:0; padding-bottom:0; opacity:0;
}

/* Form elements */
.dp-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.dp-form-group{ margin-bottom:16px; }
.dp-form-group:last-child{ margin-bottom:0; }
.dp-form-label{ display:block; font-size:.85rem; font-weight:600; color:var(--text, #333); margin-bottom:8px; }
.dp-req{ color:#E74C3C; }
.dp-input{
    width:100%; padding:12px 16px;
    border:2px solid rgba(209,213,219,0.5); border-radius:12px;
    font-size:.9rem; font-family:'DM Sans', sans-serif;
    transition:all .25s ease; background:#fff; color:var(--text, #333);
}
.dp-input:focus{ outline:none; border-color:var(--verde-albastrui-moderat, #517F89); box-shadow:0 0 0 4px rgba(81,127,137,.1); }
.dp-input::placeholder{ color:#b0bec5; }
.dp-input[disabled]{ background:rgba(244,249,249,.5); color:var(--violet-cenusiu, #6B7B8A); cursor:not-allowed; }
textarea.dp-input{ resize:vertical; min-height:60px; }
.dp-form-hint{ font-size:.8rem; color:var(--violet-cenusiu, #6B7B8A); margin-top:6px; }

.dp-info-box{
    display:flex; align-items:flex-start; gap:12px;
    padding:14px 18px; border-radius:14px;
    background:rgba(52,152,219,.08); border:1px solid rgba(52,152,219,.15);
    color:#3498DB; font-size:.85rem; margin-top:8px;
}

/* Sidebar preview */
.dp-sidebar{ position:sticky; top:88px; display:flex; flex-direction:column; gap:18px; }

.dp-preview-card{
    background:rgba(255,255,255,0.95); backdrop-filter:blur(20px);
    border-radius:20px; border:1px solid rgba(209,213,219,0.5);
    overflow:hidden; transition:all .3s ease;
}
.dp-preview-card:hover{ box-shadow:0 8px 32px rgba(0,0,0,.06); }

.dp-preview-header{
    padding:16px 20px;
    background:linear-gradient(180deg, rgba(189,220,219,.08) 0, transparent 100%);
    border-bottom:1px solid rgba(209,213,219,0.5);
    display:flex; align-items:center; gap:10px;
}
.dp-preview-header svg{ color:var(--verde-albastrui-moderat, #517F89); flex-shrink:0; }
.dp-preview-header h3{ font-size:.9rem; font-weight:700; color:var(--text, #333); margin:0; }

.dp-preview-body{ padding:20px; }
.dp-preview-body-compact{ padding:12px 20px 16px; }

/* Topbar pill preview */
.dp-pill-preview{
    display:flex; align-items:center; gap:12px;
    padding:12px 16px; border-radius:14px;
    background:linear-gradient(135deg, var(--albastru-verzui-moderat, #34555D), var(--verde-albastrui-moderat, #517F89));
    color:#fff; box-shadow:0 4px 16px rgba(52,85,93,.25);
}
.dp-pill-icon{
    width:38px; height:38px; border-radius:10px;
    background:rgba(255,255,255,.15);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.dp-pill-name{ font-weight:700; font-size:.9rem; }
.dp-pill-sub{ font-size:.75rem; opacity:.8; margin-top:2px; }
.dp-preview-hint{ font-size:.78rem; color:var(--violet-cenusiu, #6B7B8A); margin-top:12px; text-align:center; }

/* Logo area */
.dp-logo-area{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.dp-logo-preview{
    width:80px; height:80px; border-radius:16px;
    background:linear-gradient(135deg, rgba(81,127,137,.08), rgba(189,220,219,.15));
    border:2px dashed rgba(209,213,219,0.5);
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0; overflow:hidden;
}
.dp-logo-preview img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:12px; }
.dp-logo-placeholder{ font-size:.75rem; font-weight:700; color:var(--violet-cenusiu, #6B7B8A); letter-spacing:1px; }
.dp-logo-info{ flex:1; }
.dp-logo-info p{ font-size:.8rem; color:var(--violet-cenusiu, #6B7B8A); margin:0 0 8px; line-height:1.4; }
.dp-logo-filename{ font-size:.78rem; color:var(--verde-albastrui-moderat, #517F89); margin-top:6px; font-weight:500; }

.dp-btn-upload{
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 16px; border-radius:10px;
    background:rgba(244,249,249,0.6); color:var(--verde-albastrui-moderat, #517F89);
    border:1.5px solid rgba(81,127,137,.3); font-size:.82rem; font-weight:600;
    cursor:pointer; transition:all .2s ease; font-family:inherit;
}
.dp-btn-upload:hover{ background:rgba(81,127,137,.08); border-color:var(--verde-albastrui-moderat, #517F89); }

.dp-checkbox-mini{
    display:flex; align-items:center; gap:8px; cursor:pointer;
    font-size:.82rem; color:var(--violet-cenusiu, #6B7B8A); margin-top:8px;
}
.dp-checkbox-mini input{ display:none; }
.dp-checkbox-box{
    width:18px; height:18px; border:2px solid rgba(209,213,219,0.5);
    border-radius:5px; flex-shrink:0; position:relative; transition:all .2s ease;
}
.dp-checkbox-mini input:checked + .dp-checkbox-box{
    background:var(--verde-albastrui-moderat, #517F89);
    border-color:var(--verde-albastrui-moderat, #517F89);
}
.dp-checkbox-mini input:checked + .dp-checkbox-box::after{
    content:''; position:absolute; top:2px; left:5px;
    width:4px; height:8px; border:solid #fff; border-width:0 2px 2px 0;
    transform:rotate(45deg);
}

/* Tips */
.dp-tips-list{ list-style:none; padding:0; margin:0; }
.dp-tips-list li{
    display:flex; align-items:flex-start; gap:10px;
    padding:10px 0; font-size:.84rem; color:var(--violet-cenusiu, #6B7B8A);
    border-bottom:1px solid rgba(209,213,219,.3);
}
.dp-tips-list li:last-child{ border-bottom:none; }
.dp-tips-list li svg{ flex-shrink:0; color:#27AE60; margin-top:2px; }
.dp-tips-list li strong{ color:var(--text, #333); }

/* Footer bar */
.dp-footer-bar{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 24px; border-radius:20px; margin-top:8px;
    background:rgba(255,255,255,0.95); backdrop-filter:blur(20px);
    border:1px solid rgba(209,213,219,0.5);
    flex-wrap:wrap; gap:12px;
}
.dp-footer-info{ display:flex; align-items:center; gap:8px; font-size:.85rem; color:var(--violet-cenusiu, #6B7B8A); }
.dp-footer-dot{ width:8px; height:8px; border-radius:50%; background:#27AE60; flex-shrink:0; }

/* ─── RESPONSIVE ─── */
@media (max-width:1200px){
    .dp-layout{ grid-template-columns:1fr; }
    .dp-sidebar{ position:static; }
}
@media (max-width:768px){
    .dp-header{ flex-direction:column; align-items:flex-start; }
    .dp-header-actions{ width:100%; }
    .dp-btn-save{ flex:1; justify-content:center; }
    .dp-form-row{ grid-template-columns:1fr; }
    .dp-section-body{ padding:16px; }
    .dp-section-header{ padding:14px 16px; }
    .dp-footer-bar{ flex-direction:column; align-items:stretch; text-align:center; }
    .dp-footer-bar .dp-btn-save{ justify-content:center; }
}
@media (max-width:480px){
    .dp-header-icon{ width:44px; height:44px; border-radius:12px; }
    .dp-header-text h1{ font-size:1.35rem; }
    .dp-section-icon{ width:36px; height:36px; border-radius:10px; }
    .dp-section-icon svg{ width:16px; height:16px; }
}

/* Legacy aliases (keep old .mi-prov-* from breaking if referenced elsewhere) */
.mi-prov-header{ justify-content:space-between; }
.mi-prov-hero{ display:flex; gap:14px; align-items:center; }
.mi-prov-hero-icon{ width:46px; height:46px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--violet-roscat, #8E44AD), #06b6d4); color:#fff; box-shadow:0 10px 24px rgba(66,49,68,.18); }
.mi-prov-hero-title{ font-weight:900; font-size:16px; color:var(--text); line-height:1.1; }
.mi-prov-hero-subtitle{ font-size:12.5px; color:var(--violet-cenusiu); margin-top:2px; }

/* Import SQL statusbar */
.mi-statusbar{
  margin: -6px 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.7);
  color: var(--text);
  font-weight: 600;
  font-size: 13px;
  box-shadow: 0 8px 18px rgba(0,0,0,0.04);
}
.mi-statusbar.ok{ border-color: rgba(16,185,129,0.35); }
.mi-statusbar.error{ border-color: rgba(239,68,68,0.35); }
.mi-statusbar.info{ border-color: rgba(59,130,246,0.35); }




/* ============================================================
   SECTII - UI premium (Setări → Secții / Departamente)
   ============================================================ */

.mi-sec-header{ justify-content: space-between; }

/* Secții – butoane mai vizibile (contrast + dimensiuni) */
.mi-sec-header .btn.btn-sm{
    padding: 9px 14px;
    border-radius: 12px;
    font-weight: 800;
    letter-spacing: 0.1px;
}

.mi-sec-header .btn-secondary{
    background: rgba(243,244,246,0.88);
    border: 1px solid rgba(52,85,93,0.18);
    color: var(--violet-inchis);
    box-shadow: 0 10px 22px rgba(0,0,0,0.06);
}
.mi-sec-header .btn-secondary:hover{
    background: rgba(243,244,246,1);
    border-color: rgba(52,85,93,0.28);
    box-shadow: 0 12px 28px rgba(0,0,0,0.08);
}

.mi-sec-header .btn-primary{
    box-shadow: 0 10px 24px rgba(52,85,93,0.22);
}

.mi-sec-table .mi-inline-actions{ gap: 10px; flex-wrap: nowrap; }
.mi-sec-table .btn.btn-icon{
    width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 12px;
    font-size: 16px;
    line-height: 1;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(52,85,93,0.16);
    box-shadow: 0 10px 22px rgba(0,0,0,0.06);
}
.mi-sec-table .btn.btn-icon:hover{
    background: rgba(255,255,255,1);
    border-color: rgba(52,85,93,0.28);
    box-shadow: 0 12px 28px rgba(0,0,0,0.08);
}

/* Nuantare pe acțiuni */
.mi-sec-table .mi-act.mi-act-edit{
    background: rgba(14,165,233,0.10);
    border-color: rgba(14,165,233,0.28);
}
.mi-sec-table .mi-act.mi-act-delete{
    background: rgba(239,68,68,0.10);
    border-color: rgba(239,68,68,0.28);
}
.mi-sec-table .mi-act.mi-act-activate{
    background: rgba(34,197,94,0.10);
    border-color: rgba(34,197,94,0.28);
}


.mi-sec-hero{ display:flex; gap:14px; align-items:center; }
.mi-sec-hero-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background: linear-gradient(135deg, #0ea5e9, #06b6d4);
    color: #fff;
    box-shadow: 0 10px 24px rgba(14, 165, 233, 0.18);
}
.mi-sec-hero-title{ font-weight: 900; font-size: 16px; color: var(--text); line-height: 1.1; }
.mi-sec-hero-subtitle{ font-size: 12.5px; color: var(--violet-cenusiu); margin-top: 2px; }

.mi-sec-layout{
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 18px;
    align-items: start;
}

@media (max-width: 980px){
    .mi-sec-layout{ grid-template-columns: 1fr; }
    .mi-sec-side{ position: static; }
}

.mi-sec-side{ position: sticky; top: 88px; display:flex; flex-direction:column; gap: 14px; }

.mi-sec-side-card{
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 14px;
    background: rgba(255,255,255,0.85);
}

.mi-sec-side-title{
    font-weight: 900;
    font-size: 13px;
    color: var(--violet-inchis);
    margin-bottom: 10px;
}

.mi-sec-tips{ margin: 0; padding-left: 18px; color: var(--violet-cenusiu); font-size: 13px; }
.mi-sec-tips li{ margin: 8px 0; }

.mi-sec-toolbar{
    display:flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}

.mi-sec-search{ flex: 1; min-width: 240px; max-width: 520px; }

.mi-sec-toolbar-right{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }

.mi-sec-form-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

@media (max-width: 820px){
    .mi-sec-form-grid{ grid-template-columns: 1fr; }
}

.mi-sec-form-wide{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--border-soft);
}

.mi-sec-table .mi-sec-dot{
    width: 10px;
    height: 10px;
    border-radius: 999px;
    margin-top: 7px;
    background: linear-gradient(135deg, #0ea5e9, #06b6d4);
    box-shadow: 0 6px 18px rgba(14, 165, 233, 0.18);
    flex: 0 0 10px;
}

.mi-row-inactive{
    opacity: 0.68;
}

.mi-sec-contact{
    display:flex;
    flex-direction: column;
    gap: 4px;
}

.mi-sec-badges{
    display:flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mi-sec-stats{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.mi-sec-stat{
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    padding: 10px 12px;
    background: linear-gradient(180deg, rgba(255,255,255,1), rgba(243,244,246,0.35));
}

.mi-sec-stat-label{
    font-size: 12px;
    color: var(--violet-cenusiu);
}

.mi-sec-stat-value{
    font-size: 18px;
    font-weight: 900;
    color: var(--text);
    margin-top: 2px;
}


/* ============================================================
   CONEXIUNI EXTERNE — PREMIUM DESIGN (cx-*)
   ============================================================ */
.cx-layout{
    display:grid; grid-template-columns:380px 1fr;
    gap:24px; align-items:start;
}
.cx-list-panel{ position:sticky; top:88px; display:flex; flex-direction:column; gap:18px; }

/* Search */
.cx-search-wrap{
    position:relative; display:flex; align-items:center; margin-bottom:14px;
}
.cx-search-wrap svg{
    position:absolute; left:14px; color:var(--violet-cenusiu, #6B7B8A); pointer-events:none;
}
.cx-search-input{ padding-left:42px !important; }

/* New button */
.cx-btn-new{
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 16px; border-radius:10px; font-size:.82rem; font-weight:700;
    background:linear-gradient(135deg, var(--albastru-verzui-moderat, #34555D), var(--verde-albastrui-moderat, #517F89));
    color:#fff; border:none; cursor:pointer; font-family:inherit;
    box-shadow:0 2px 8px rgba(81,127,137,.25); transition:all .2s ease;
}
.cx-btn-new:hover{ transform:translateY(-1px); box-shadow:0 4px 14px rgba(81,127,137,.35); }

/* Connection list items (JS renders these) */
.mi-ext-list{ display:flex; flex-direction:column; gap:8px; }

.mi-ext-item{
    width:100%; text-align:left;
    border:2px solid rgba(209,213,219,0.5);
    background:rgba(255,255,255,0.95); backdrop-filter:blur(10px);
    border-radius:14px; padding:14px 16px;
    cursor:pointer; transition:all .2s ease; font-family:inherit;
}
.mi-ext-item:hover{
    transform:translateY(-1px);
    box-shadow:0 8px 24px rgba(0,0,0,.06);
    border-color:rgba(81,127,137,.25);
}
.mi-ext-item.active{
    border-color:var(--verde-albastrui-moderat, #517F89);
    background:linear-gradient(135deg, rgba(81,127,137,.06), rgba(189,220,219,.12));
    box-shadow:0 8px 28px rgba(81,127,137,.12);
}

.mi-ext-item-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.mi-ext-item-title{ font-weight:700; font-size:.9rem; color:var(--text, #333); }
.mi-ext-item-sub{ margin-top:4px; font-size:.78rem; color:var(--violet-cenusiu, #6B7B8A); }
.mi-ext-item-meta{ margin-top:2px; font-size:.75rem; color:var(--violet-cenusiu, #6B7B8A); opacity:.7; }

.mi-ext-badges{ display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end; }
.mi-badge{
    font-size:.7rem; font-weight:600; padding:3px 10px;
    border-radius:20px; border:1px solid rgba(81,127,137,.18);
    background:rgba(189,220,219,.18); color:rgba(51,51,51,.88); line-height:1.2;
}
.mi-badge.green{ background:rgba(39,174,96,.1); border-color:rgba(39,174,96,.25); color:#1a6b3a; }
.mi-badge.red{ background:rgba(231,76,60,.08); border-color:rgba(231,76,60,.25); color:#8b2520; }
.mi-badge.blue{ background:rgba(52,152,219,.08); border-color:rgba(52,152,219,.25); color:#1a5580; }

/* Empty state */
.cx-empty{
    display:flex; flex-direction:column; align-items:center; gap:10px;
    padding:32px 16px; text-align:center;
    border:2px dashed rgba(209,213,219,0.5); border-radius:14px;
    color:var(--violet-cenusiu, #6B7B8A); font-size:.85rem;
    background:rgba(244,249,249,.4);
}

/* Form section labels */
.cx-form-section-label{
    display:flex; align-items:center; gap:10px;
    font-size:.82rem; font-weight:700; color:var(--verde-albastrui-moderat, #517F89);
    text-transform:uppercase; letter-spacing:.5px;
    margin:20px 0 12px; padding-bottom:8px;
    border-bottom:2px solid rgba(209,213,219,.35);
}
.cx-form-section-label:first-child{ margin-top:0; }
.cx-form-section-label svg{ flex-shrink:0; }

/* Form action buttons in header */
.cx-form-actions{ display:flex; gap:8px; flex-shrink:0; }
.cx-btn-sm{ padding:9px 16px !important; font-size:.82rem !important; }

/* Delete button */
.cx-btn-delete{
    display:inline-flex; align-items:center; gap:8px;
    padding:10px 18px; border-radius:12px; font-size:.85rem; font-weight:600;
    background:rgba(231,76,60,.08); color:#c0392b;
    border:2px solid rgba(231,76,60,.2); cursor:pointer; font-family:inherit;
    transition:all .25s ease;
}
.cx-btn-delete:hover{
    background:rgba(231,76,60,.15); border-color:rgba(231,76,60,.4);
    transform:translateY(-1px);
}

/* Status box (used by JS) */
.mi-ext-status{
    border:2px solid rgba(209,213,219,0.5); background:rgba(255,255,255,.65);
    border-radius:14px; padding:16px 18px;
    font-size:.85rem; color:var(--text, #333); margin-top:16px;
}
.mi-ext-status.ok{ border-color:rgba(39,174,96,.3); background:rgba(39,174,96,.06); }
.mi-ext-status.bad{ border-color:rgba(231,76,60,.3); background:rgba(231,76,60,.06); }

/* ─── Responsive ─── */
@media (max-width:1100px){
    .cx-layout{ grid-template-columns:1fr; }
    .cx-list-panel{ position:static; }
}
@media (max-width:768px){
    .cx-form-actions{ flex-direction:column; }
    .cx-btn-sm{ width:100%; justify-content:center; }
    .dp-section-header .cx-form-actions{ display:none; }
}

/* Legacy mi-ext-empty alias */
.mi-ext-empty{ display:none; }

/* ============================================================
   REȚETE — PREMIUM GRID (rx-premium-*)
   ============================================================ */
.rx-premium-grid{
    display:grid; grid-template-columns:1fr 1fr;
    gap:24px; align-items:start;
}
@media (max-width:1100px){ .rx-premium-grid{ grid-template-columns:1fr; } }

/* Legacy rx-admin-grid alias */
.rx-admin-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:1100px){ .rx-admin-grid{ grid-template-columns:1fr; } }

/* ----------------------------------------------------------
 * MI Scroll Toggle FAB (sus/jos)
 * ---------------------------------------------------------- */
.mi-scroll-toggle{
    position: fixed;
    right: 22px;
    bottom: 22px;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    border: 1px solid rgba(81,127,137,0.26);
    background: rgba(255,255,255,0.92);
    color: rgba(45, 70, 74, 0.92);
    box-shadow: 0 16px 40px rgba(31,50,54,0.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.mi-scroll-toggle:hover{
    transform: translateY(-2px);
    box-shadow: 0 20px 46px rgba(31,50,54,0.22);
}
.mi-scroll-toggle:active{
    transform: translateY(0);
}
.mi-scroll-toggle:focus{
    outline: none;
    box-shadow: 0 0 0 4px rgba(81,127,137,0.20), 0 16px 40px rgba(31,50,54,0.18);
}
.mi-scroll-toggle .mi-scroll-icon{
    width: 22px;
    height: 22px;
    display: block;
    transition: transform .22s ease;
}
/* Icon default = sus; cand dir=down rotim */
.mi-scroll-toggle[data-dir="down"] .mi-scroll-icon{
    transform: rotate(180deg);
}

.mi-scroll-toggle.is-hidden{
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px) scale(0.96);
}

@media (max-width: 640px){
    .mi-scroll-toggle{
        right: 16px;
        bottom: 16px;
        width: 50px;
        height: 50px;
        border-radius: 16px;
    }
}


/* =====================
   Rețete - rânduri premium + autocomplete medicamente
   ===================== */
.rx-items-scroll{
  margin:0 -4px;
  padding:2px 4px 12px;
  scrollbar-color:rgba(66,116,128,.45) transparent;
}
.rx-items-table{
  min-width:1120px;
  border-collapse:separate !important;
  border-spacing:0 10px !important;
  margin:0 !important;
}
.rx-items-table thead th{
  padding:4px 12px 7px !important;
  border:0 !important;
  background:transparent !important;
  color:#70838d;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
}
#rxItemsBody{counter-reset:rx-item-row;}
#rxItemsBody .rx-item-row{counter-increment:rx-item-row;}
#rxItemsBody .rx-item-row td{
  padding:12px 8px !important;
  vertical-align:middle;
  border-top:1px solid rgba(104,143,153,.18) !important;
  border-bottom:1px solid rgba(104,143,153,.18) !important;
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(245,250,251,.94));
  box-shadow:0 10px 24px rgba(37,75,86,.045);
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
#rxItemsBody .rx-item-row:hover td{
  background:linear-gradient(135deg,#fff,rgba(238,248,249,.98));
  border-color:rgba(55,125,139,.30) !important;
  box-shadow:0 14px 30px rgba(37,75,86,.075);
}
#rxItemsBody .rx-item-row td:first-child{
  position:relative;
  padding-left:54px !important;
  border-left:1px solid rgba(104,143,153,.18) !important;
  border-radius:17px 0 0 17px;
}
#rxItemsBody .rx-item-row td:first-child::before{
  content:counter(rx-item-row,decimal-leading-zero);
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:linear-gradient(145deg,#315f68,#6ca5ad);
  color:#fff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow:0 7px 16px rgba(49,95,104,.24),inset 0 1px 0 rgba(255,255,255,.24);
}
#rxItemsBody .rx-item-row td:last-child{
  padding-right:12px !important;
  border-right:1px solid rgba(104,143,153,.18) !important;
  border-radius:0 17px 17px 0;
}
#rxItemsBody .rx-item-row .form-control{
  height:42px;
  min-height:42px;
  padding:9px 11px;
  border:1px solid rgba(111,145,154,.22);
  border-radius:12px;
  background:rgba(255,255,255,.88);
  color:#294952;
  font-size:12.5px;
  font-weight:650;
  box-shadow:inset 0 1px 2px rgba(43,81,91,.025);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
#rxItemsBody .rx-item-row .form-control:hover{
  border-color:rgba(69,126,139,.38);
  background:#fff;
}
#rxItemsBody .rx-item-row .form-control:focus{
  border-color:#4f8f99;
  background:#fff;
  box-shadow:0 0 0 4px rgba(79,143,153,.12),0 8px 18px rgba(54,103,114,.08);
  outline:0;
}
#rxItemsBody .rx-med-name{
  font-weight:800 !important;
  color:#234751 !important;
}
#rxItemsBody .rx-remove-item{
  width:40px !important;
  height:40px !important;
  border:1px solid rgba(211,86,104,.18) !important;
  border-radius:12px !important;
  background:linear-gradient(145deg,#fff,#fff5f6) !important;
  color:#c24d61 !important;
  box-shadow:0 7px 15px rgba(167,58,77,.07);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease !important;
}
#rxItemsBody .rx-remove-item:hover{
  transform:translateY(-1px);
  background:linear-gradient(145deg,#fff7f8,#ffecef) !important;
  box-shadow:0 10px 20px rgba(167,58,77,.13);
}
.rx-add-item{
  min-height:40px;
  padding:9px 15px !important;
  border:1px solid rgba(74,132,143,.20) !important;
  border-radius:13px !important;
  background:linear-gradient(145deg,#fff,#edf7f8) !important;
  color:#315f68 !important;
  font-weight:850 !important;
  box-shadow:0 8px 18px rgba(40,84,94,.07);
}
.rx-add-item:hover{
  transform:translateY(-1px);
  border-color:rgba(74,132,143,.35) !important;
  box-shadow:0 12px 24px rgba(40,84,94,.11);
}
.rx-item-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.rx-open-catalog{
  min-height:39px;
  padding:8px 15px !important;
  border:1px solid rgba(49,95,104,.24) !important;
  border-radius:12px !important;
  background:linear-gradient(145deg,#315f68,#5d929b) !important;
  color:#fff !important;
  font-weight:850 !important;
  box-shadow:0 9px 22px rgba(41,86,96,.18);
  transition:transform .18s ease,box-shadow .18s ease !important;
}
.rx-open-catalog:hover{transform:translateY(-1px);box-shadow:0 13px 28px rgba(41,86,96,.24);}
#rxItemsBody .rx-item-row.rx-item-new td{animation:rxItemAdded .85s ease;}
@keyframes rxItemAdded{0%,30%{background:#e3f8ef;box-shadow:0 0 0 3px rgba(52,168,119,.18)}100%{background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(245,250,251,.94));}}
.rx-med-cell{position:relative;}
.rx-suggest{
  position:fixed;
  left:10px;
  top:10px;
  display:none;
  padding:7px;
  background:linear-gradient(145deg,rgba(255,255,255,.985),rgba(243,249,250,.98));
  border:1px solid rgba(70,125,136,.24);
  border-radius:17px;
  box-shadow:0 24px 60px rgba(31,68,78,.20),0 6px 18px rgba(31,68,78,.10),inset 0 1px 0 rgba(255,255,255,.95);
  overflow:auto;
  overscroll-behavior:contain;
  z-index:2147483000;
  backdrop-filter:blur(18px);
}
.rx-suggest-item{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 20px;
  align-items:center;
  gap:10px;
  min-height:52px;
  padding:8px 10px;
  color:#284b54;
  cursor:pointer;
  border:1px solid transparent;
  border-radius:12px;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.rx-suggest-item:hover{
  background:linear-gradient(135deg,rgba(224,242,244,.92),rgba(239,247,248,.96));
  border-color:rgba(66,126,138,.16);
  transform:translateX(1px);
}
.rx-suggest-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:linear-gradient(145deg,#315f68,#6ca5ad);
  color:#fff;
  font-size:11px;
  font-weight:900;
  box-shadow:0 7px 16px rgba(49,95,104,.20);
}
.rx-suggest-copy{display:flex;flex-direction:column;min-width:0;line-height:1.2;}
.rx-suggest-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:900;}
.rx-suggest-copy small{margin-top:4px;color:#71858d;font-size:11px;font-weight:700;}
.rx-suggest-arrow{color:#72919a;font-size:22px;font-weight:400;text-align:center;}
.rx-suggest-status{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:11px 12px;
  color:#56717a;
  font-size:12px;
  font-weight:750;
}
.rx-suggest-status.is-empty,.rx-suggest-status.is-error{align-items:flex-start;flex-direction:column;gap:4px;}
.rx-suggest-status strong{color:#31545d;font-size:12.5px;font-weight:900;}
.rx-suggest-status span{color:#74868d;font-weight:650;line-height:1.35;}
.rx-suggest-status.is-error strong{color:#b64659;}
.rx-suggest-loader{
  width:18px;
  height:18px;
  flex:0 0 auto;
  border:2px solid rgba(73,132,143,.18);
  border-top-color:#4f8f99;
  border-radius:50%;
  animation:rxSuggestSpin .75s linear infinite;
}
@keyframes rxSuggestSpin{to{transform:rotate(360deg)}}

body.rx-catalog-open{overflow:hidden;}
.rx-catalog-modal{
  position:fixed;
  inset:0;
  z-index:2147482000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(20,47,55,.52);
  backdrop-filter:blur(10px);
}
.rx-catalog-modal.is-open{display:flex;animation:rxCatalogFade .2s ease;}
@keyframes rxCatalogFade{from{opacity:0}to{opacity:1}}
.rx-catalog-dialog{
  width:min(1060px,96vw);
  height:min(790px,91vh);
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.65);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(240,248,249,.985));
  box-shadow:0 38px 100px rgba(13,43,51,.34),inset 0 1px 0 #fff;
  animation:rxCatalogRise .25s cubic-bezier(.2,.8,.2,1);
}
@keyframes rxCatalogRise{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:none}}
.rx-catalog-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 24px;
  color:#fff;
  background:linear-gradient(120deg,#294f59,#4e8791 62%,#74aeb5);
  box-shadow:0 10px 28px rgba(44,91,101,.16);
}
.rx-catalog-title-wrap{display:flex;align-items:center;gap:14px;min-width:0;}
.rx-catalog-logo{
  width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border-radius:15px;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.24);font-size:20px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.rx-catalog-title-wrap h3{margin:0;color:#fff;font-size:20px;font-weight:900;letter-spacing:-.02em;}
.rx-catalog-title-wrap p{margin:4px 0 0;color:rgba(255,255,255,.78);font-size:12px;font-weight:650;}
.rx-catalog-close{
  width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);
  border-radius:13px;background:rgba(255,255,255,.12);color:#fff;font-size:27px;line-height:1;cursor:pointer;
  transition:background .18s ease,transform .18s ease;
}
.rx-catalog-close:hover{background:rgba(255,255,255,.22);transform:rotate(3deg);}
.rx-catalog-toolbar{padding:18px 24px 12px;}
.rx-catalog-search{position:relative;display:flex;align-items:center;}
.rx-catalog-search>i{position:absolute;left:17px;color:#5c7d86;font-size:14px;pointer-events:none;}
.rx-catalog-search input{
  width:100%;height:50px;padding:0 145px 0 45px;border:1px solid rgba(73,126,137,.24);border-radius:15px;
  background:rgba(255,255,255,.94);color:#294a53;font-size:14px;font-weight:700;
  box-shadow:0 8px 22px rgba(41,81,91,.06),inset 0 1px 2px rgba(41,81,91,.03);outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.rx-catalog-search input:focus{border-color:#4f8f99;box-shadow:0 0 0 4px rgba(79,143,153,.13),0 12px 27px rgba(41,81,91,.08);}
.rx-catalog-count{position:absolute;right:15px;color:#71878e;font-size:11px;font-weight:850;white-space:nowrap;}
.rx-catalog-results{
  min-height:0;overflow:auto;overscroll-behavior:contain;padding:10px 24px 22px;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:11px;
}
.rx-catalog-card{
  min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;
  min-height:91px;padding:13px;border:1px solid rgba(86,132,142,.18);border-radius:17px;
  background:linear-gradient(145deg,#fff,rgba(242,249,250,.92));box-shadow:0 9px 24px rgba(34,74,84,.055);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.rx-catalog-card:hover{transform:translateY(-1px);border-color:rgba(75,137,148,.34);box-shadow:0 14px 31px rgba(34,74,84,.09);}
.rx-catalog-card.is-added{background:linear-gradient(145deg,#f7fffb,#eaf8f1);border-color:rgba(45,155,107,.22);}
.rx-catalog-card-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#315f68,#6ca5ad);color:#fff;font-size:12px;font-weight:950;box-shadow:0 8px 18px rgba(49,95,104,.20);}
.rx-catalog-card-copy{min-width:0;display:flex;flex-direction:column;gap:5px;}
.rx-catalog-card-copy>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#274a53;font-size:13.5px;font-weight:900;}
.rx-catalog-card-copy>small{color:#82939a;font-size:10px;font-weight:750;}
.rx-catalog-meta{display:flex;gap:5px;flex-wrap:wrap;}
.rx-catalog-meta span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:3px 7px;border-radius:999px;background:#edf5f6;color:#627b83;font-size:10px;font-weight:800;}
.rx-catalog-add{
  min-width:94px;height:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 12px;
  border:0;border-radius:11px;background:linear-gradient(145deg,#315f68,#5e969f);color:#fff;font-size:11px;font-weight:900;
  box-shadow:0 8px 17px rgba(44,91,101,.17);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease;
}
.rx-catalog-add:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 11px 22px rgba(44,91,101,.23);}
.rx-catalog-add:disabled{background:#d8eee4;color:#267b56;box-shadow:none;cursor:default;}
.rx-catalog-loading{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);gap:11px;}
.rx-catalog-loading span{height:91px;border-radius:17px;background:linear-gradient(90deg,#edf4f5 25%,#f9fcfc 50%,#edf4f5 75%);background-size:200% 100%;animation:rxCatalogShimmer 1.2s infinite;}
@keyframes rxCatalogShimmer{to{background-position:-200% 0}}
.rx-catalog-empty{grid-column:1/-1;min-height:270px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;text-align:center;color:#71858d;}
.rx-catalog-empty>span{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#e8f3f4;color:#4e8791;font-size:19px;}
.rx-catalog-empty strong{color:#31545d;font-size:15px;font-weight:900;}.rx-catalog-empty small{font-size:12px;}.rx-catalog-empty.is-error>span{background:#fff0f1;color:#bd4c60;}
.rx-catalog-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 24px;border-top:1px solid rgba(86,132,142,.14);background:rgba(255,255,255,.72);}
.rx-catalog-foot>span{margin-right:auto;color:#71858d;font-size:11px;font-weight:700;}

@media (max-width:700px){
  .rx-items-table{min-width:1020px;}
  #rxItemsBody .rx-item-row td{padding-top:9px !important;padding-bottom:9px !important;}
  .rx-suggest{border-radius:15px;}
  .rx-catalog-modal{padding:8px;}
  .rx-catalog-dialog{width:100%;height:96vh;border-radius:19px;}
  .rx-catalog-head{padding:15px;}.rx-catalog-toolbar{padding:13px 13px 7px;}
  .rx-catalog-results{grid-template-columns:1fr;padding:7px 13px 16px;}
  .rx-catalog-loading{grid-template-columns:1fr;}
  .rx-catalog-card{grid-template-columns:40px minmax(0,1fr);}.rx-catalog-add{grid-column:1/-1;width:100%;}
  .rx-catalog-foot{padding:11px 13px;}.rx-catalog-foot>span{display:none;}
}

/* =====================
   Diagnostice - autocomplete cod diagnostic
   ===================== */
.diag-code-wrap{position:relative;}
.diag-suggest{
  position:absolute;
  left:0;
  right:0;
  top:100%;
  margin-top:6px;
  display:none;
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
  max-height:260px;
  overflow:auto;
  z-index:2000;
}
.diag-suggest-item{
  padding:10px 12px;
  font-size:13px;
  cursor:pointer;
  border-bottom:1px solid rgba(0,0,0,.06);
}
.diag-suggest-item:last-child{border-bottom:none;}
.diag-suggest-item:hover{background:rgba(99,102,241,.10);}
.diag-hint{display:none; margin-top:6px; font-size:12px; color:var(--text-muted);}


/* =====================================================================
   CONSULTAȚIE - Import CAS extern (card + liste)
   ===================================================================== */

.services-right-column{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.services-right-column .card{height:auto;}

.services-extcas-card .card-body{padding:14px;}

.extcas-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.extcas-row{flex:1; min-width:160px;}
.extcas-row label{display:block; font-size:.75rem; color:var(--text-muted); margin-bottom:4px;}

.extcas-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
@media (max-width: 1200px){
  .extcas-split{grid-template-columns:1fr;}
}

.extcas-panel-title{font-weight:700; font-size:.85rem; margin:6px 0 8px; color:var(--text-primary);} 
.extcas-list{
  max-height:220px;
  overflow:auto;
  border:1px solid var(--border-soft);
  border-radius:12px;
  padding:6px;
  background: var(--bg-card, #fff);
}

.extcas-item{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius:10px;
  cursor:pointer;
}
.extcas-item:hover{background:rgba(81,127,137,0.08);} 
.extcas-item.active{background:rgba(81,127,137,0.14); border:1px solid rgba(81,127,137,0.25);} 
.extcas-item .title{font-weight:700; font-size:.85rem;}
.extcas-item .sub{font-size:.75rem; color:var(--text-muted);} 

.extcas-svc{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:8px 10px;
  border-radius:10px;
}
.extcas-svc + .extcas-svc{border-top:1px dashed rgba(0,0,0,0.07);} 
.extcas-svc.disabled{opacity:.55;} 
.extcas-svc .svc-main{flex:1;}
.extcas-svc .svc-name{font-weight:700; font-size:.82rem;}
.extcas-svc .svc-meta{font-size:.74rem; color:var(--text-muted);} 

.extcas-chip{display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:.72rem; background: rgba(81,127,137,0.12); color: var(--verde-albastrui-moderat);}
.extcas-chip.imported{background: rgba(40,167,69,0.15); color:#28a745;}
.extcas-chip.foreign{margin-left:6px; background: rgba(124,77,255,0.12); color:#6b4fd8;}

.extcas-footer{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px;} 
.extcas-totals{font-weight:700;} 
.extcas-footer .btn.is-soft-disabled{opacity:.6; cursor:not-allowed; transform:none;}
.extcas-hint{margin-top:8px; font-size:.78rem; color:var(--text-muted);} 

/* Documente CAS (în cardul Import CAS extern) */
.extcas-docs-wrap{margin-top:6px; padding-top:6px; border-top:1px dashed rgba(0,0,0,0.08);} 
.extcas-docs{display:flex; flex-direction:column; gap:8px;}
.extcas-docs.extcas-list{max-height:none; overflow:visible;}
.extcas-docs-list{padding:8px;} /* un pic mai aerisit decât lista standard */
.extcas-doc-row{display:grid; grid-template-columns:110px 1fr; gap:8px; align-items:center;}
.extcas-doc-row .lbl{font-weight:700; font-size:.78rem; color:var(--text-primary);}
.extcas-doc-row .val{font-size:.78rem; color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.extcas-doc-row .btn{padding:4px 8px; border-radius:10px;}
.extcas-doc-hint{font-size:.74rem; color:var(--text-muted); margin-top:2px; padding-left:2px;}

/* Documente CAS - rânduri ca la servicii (checkbox + chip) */
.extcas-doc-svc{align-items:center;}
.extcas-doc-svc .svc-name{font-size:.80rem;}
.extcas-doc-svc .svc-meta{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width: 100%;}


/* =====================================================================
   Global Loading Overlay (UX) - reduce senzația de "blocare" la click
   ===================================================================== */
.mi-loading-overlay{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
}
.mi-loading-overlay.is-active{
  opacity: 1;
  pointer-events: auto;
}
.mi-loading-card{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 20px 60px rgba(0,0,0,.12);
  max-width: 440px;
}
.mi-spinner{
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 3px solid rgba(0,0,0,.14);
  border-top-color: rgba(0,0,0,.55);
  animation: miSpin .8s linear infinite;
  flex: 0 0 auto;
}
@keyframes miSpin{ to{ transform: rotate(360deg);} }
.mi-loading-text{font-weight: 800; color: var(--text-primary);} 
.mi-loading-sub{font-size: .82rem; color: var(--text-muted); margin-top: 2px;}

/* ============================================================
   SETUP WIZARD (Configurare inițială)
   ============================================================ */
.setup-card { max-width: 760px; }
.setup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.setup-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.setup-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.setup-note { font-size: 12px; color: var(--violet-cenusiu); }
.setup-section-title { font-weight: 800; font-size: 13px; margin: 16px 0 10px; color: var(--violet-inchis); letter-spacing: .2px; }
.setup-divider { margin: 16px 0; border: 0; height: 1px; background: var(--light-bg); }
@media (max-width: 900px) { .setup-grid, .setup-grid-3 { grid-template-columns: 1fr; } }


/* ================================================================
   ================================================================
   MEDICARE PRO — COMPREHENSIVE MOBILE RESPONSIVE
   v1600-mobile — Perfect responsivity for all screen sizes
   ================================================================
   ================================================================ */

/* ================================================================
   0. GLOBAL RESPONSIVE HELPERS
   ================================================================ */

/* Touch-friendly minimum sizes */
.btn, .icon-btn, button, select, input[type="text"],
input[type="email"], input[type="password"], input[type="number"],
input[type="date"], input[type="time"], input[type="tel"],
textarea, .form-control {
    min-height: 44px;  /* Apple HIG minimum touch target */
}

/* Prevent horizontal overflow on body */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Smooth scrolling for better UX */
html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

/* All images fluid */
img {
    max-width: 100%;
    height: auto;
}

/* ================================================================
   1. TABLET LANDSCAPE (≤ 1200px)
   ================================================================ */
@media (max-width: 1200px) {

    /* Topbar: slightly tighter */
    .topbar.topbar-premium {
        padding: 0 16px;
        gap: 10px;
    }

    /* Provider pill: hide subtitle */
    .provider-pill .pill-subtitle {
        display: none;
    }

    /* User pill: compact */
    .user-pill .pill-text .pill-subtitle {
        display: none;
    }

    /* Search box compact */
    .search-box {
        max-width: 260px;
    }

    /* Dashboard grid single col at this point */
    .dashboard-grid {
        grid-template-columns: 1fr !important;
    }

    /* CX layout */
    .cx-layout {
        grid-template-columns: 1fr;
    }
    .cx-list-panel {
        position: static;
    }
}

/* ================================================================
   2. TABLET PORTRAIT (≤ 1024px)
   ================================================================ */
@media (max-width: 1024px) {

    /* Hide the separate sidebar mobile toggle — use topbar hamburger instead */
    .sidebar-mobile-toggle {
        display: none !important;
    }

    /* Topbar: no extra left padding for mobile toggle button anymore */
    .topbar,
    .topbar.topbar-premium {
        padding: 0 12px !important;
    }

    /* Topbar gap tighter */
    .topbar.topbar-premium {
        gap: 8px;
    }

    /* Provider pill: compact, only show icon */
    .provider-pill .pill-text {
        display: none;
    }
    .provider-pill {
        min-height: auto;
        padding: 8px 10px;
        border-radius: 14px;
    }
    .brand-pill-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }

    /* Datetime pill: hide on tablet */
    .datetime-pill {
        display: none;
    }

    /* Search: full width of center */
    .topbar-center {
        flex: 1 1 0;
        min-width: 0;
    }
    .search-box {
        max-width: 100%;
    }

    /* Dropdowns: wider on tablet */
    .dropdown-card {
        width: min(340px, calc(100vw - 24px));
        right: 0;
    }

    /* Provider dropdown left-aligned */
    .provider-wrap .dropdown-card {
        left: 0;
        right: auto;
    }

    /* Main content & sidebar already handled — ensure clean */
    .main,
    .main-content {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .main.sidebar-collapsed,
    .main-content.sidebar-collapsed,
    .sidebar-premium.collapsed ~ .main,
    .sidebar-premium.collapsed ~ .main-content {
        margin-left: 0 !important;
        width: 100% !important;
    }

    /* Content padding */
    .content {
        padding: 16px;
    }

    /* Cards: less padding */
    .card-body {
        padding: 16px;
    }
    .card-header {
        padding: 14px 16px;
    }

    /* Page header: stack */
    .page-header {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 20px;
    }
    .header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    /* Stat cards: 2 columns */
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .stat-card {
        padding: 16px;
    }
    .stat-value {
        font-size: 22px;
    }

    /* Stats premium grid */
    .stats-premium-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px;
    }

    /* Tables: ensure horizontal scroll */
    .table-container,
    .card-body:has(> .table),
    .card:has(> .card-body > .table) .card-body {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Tables min-width so they scroll */
    .table {
        min-width: 600px;
    }

    /* Calendar layout already handled at 1000px */

    /* Form rows */
    .form-row-3, .form-row-4 {
        grid-template-columns: 1fr 1fr;
    }

    /* Consultation tabs: scrollable */
    .consultation-tabs-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        padding-bottom: 0;
    }
    .consultation-tabs {
        flex-shrink: 0;
        min-width: max-content;
    }
    .consultation-tab {
        padding: 12px 16px;
        white-space: nowrap;
        font-size: 0.88rem;
    }

    /* Tabs generic: scrollable */
    .tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        flex-wrap: nowrap;
    }
    .tab {
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* Filter bar: scroll */
    .filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 12px;
        gap: 8px;
    }
    .filter-group {
        flex-shrink: 0;
    }

    /* Equipment layout */
    .eq-layout,
    .eq-detail-layout {
        grid-template-columns: 1fr !important;
    }

    /* Settings personal layout */
    .mi-emp-layout {
        grid-template-columns: 1fr !important;
    }

    /* Services layout */
    .mi-svc-layout {
        grid-template-columns: 1fr !important;
    }

    /* Investigation admin layout */
    .inv-admin-layout {
        grid-template-columns: 1fr !important;
    }

    /* Sectii layout */
    .mi-sec-layout {
        grid-template-columns: 1fr !important;
    }
    .mi-sec-side {
        position: static !important;
    }

    /* Pontaj — ensure grid layouts stack */
    .pontaj-layout,
    .pontaj-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ================================================================
   3. SMALL TABLET / LARGE PHONE (≤ 768px)
   ================================================================ */
@media (max-width: 768px) {

    /* Topbar: minimal */
    .topbar, .topbar.topbar-premium {
        height: 58px;
        padding: 0 10px !important;
        gap: 6px;
    }

    /* Topbar hamburger: slightly smaller */
    .topbar-hamburger {
        width: 38px;
        height: 38px;
    }

    /* App shell: adjust for shorter topbar */
    .app-shell {
        padding-top: 58px;
    }

    /* Sidebar: on mobile, starts from top of screen */
    .sidebar-premium {
        top: 0;
        height: 100vh;
    }

    /* Hide help button on mobile */
    #helpBtn {
        display: none;
    }

    /* User pill: only show avatar */
    .user-pill .pill-text {
        display: none;
    }
    .user-pill .caret {
        display: none;
    }
    .user-pill {
        padding: 8px;
        border-radius: 14px;
    }

    /* Notif button: slightly smaller */
    .icon-btn {
        width: 38px;
        height: 38px;
    }

    /* Search box: compact */
    .search-box {
        padding: 8px 12px;
        border-radius: 10px;
    }
    .search-box input {
        font-size: 13px;
    }

    /* Content */
    .content {
        padding: 12px;
    }

    /* Page title smaller */
    .page-title {
        font-size: 20px;
    }

    /* Stats grid: single column */
    .stats-grid {
        grid-template-columns: 1fr;
    }

    /* Stats premium: single column */
    .stats-premium-grid {
        grid-template-columns: 1fr !important;
    }

    /* Form rows: all single column */
    .form-row,
    .form-row-2,
    .form-row-3,
    .form-row-4 {
        grid-template-columns: 1fr !important;
    }

    /* Buttons: wrap and full width when in header-actions */
    .header-actions {
        flex-direction: column;
        gap: 8px;
    }
    .header-actions .btn {
        width: 100%;
        justify-content: center;
    }

    /* Modal: nearly fullscreen */
    .modal-overlay {
        padding: 8px;
    }
    .modal {
        max-width: 100%;
        max-height: 95vh;
        border-radius: 16px;
    }
    .modal-lg {
        max-width: 100%;
    }
    .modal-xl {
        max-width: 100%;
    }
    .modal-header {
        padding: 14px 16px;
    }
    .modal-body {
        padding: 16px;
    }
    .modal-footer {
        padding: 12px 16px;
        flex-wrap: wrap;
    }
    .modal-footer .btn {
        flex: 1;
        min-width: 0;
        justify-content: center;
    }

    /* MI-modal: nearly fullscreen */
    .mi-modal {
        padding: 8px;
    }
    .mi-modal-content {
        width: 100%;
        max-height: 95vh;
        border-radius: 16px;
    }
    .mi-modal-body {
        padding: 14px;
    }

    /* Card body compact */
    .card-body {
        padding: 14px;
    }

    /* Dashboard welcome banner */
    .welcome-banner {
        padding: 20px 16px;
        border-radius: 16px;
    }
    .welcome-name {
        font-size: 22px;
    }
    .welcome-subtitle {
        font-size: 13px;
    }
    .welcome-visual {
        display: none;
    }
    .welcome-actions {
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    .btn-welcome {
        width: 100%;
        justify-content: center;
        padding: 12px 16px;
    }

    /* Dashboard cards */
    .dashboard-card-header {
        padding: 14px 16px;
    }
    .dashboard-card-body {
        padding: 14px 16px;
    }

    /* Consultation header: stack */
    .consultation-header-premium {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
        margin: -14px -14px 0 -14px;
    }
    .consultation-header-right {
        width: 100%;
        flex-wrap: wrap;
        gap: 6px;
    }

    /* Consultation grid: single column */
    .consultation-grid {
        grid-template-columns: 1fr !important;
    }
    .consultation-col-patient {
        order: 1;
    }
    .consultation-col-services {
        order: 2;
    }
    .consultation-col-notes {
        order: 3;
        grid-column: auto;
    }

    /* Patient tab layout */
    .patient-row-two {
        grid-template-columns: 1fr !important;
    }

    /* Appointment items: stack info */
    .appointment-item {
        flex-wrap: wrap;
    }
    .appointment-actions {
        width: 100%;
        justify-content: flex-end;
    }

    /* Waiting items: stack */
    .waiting-item-main {
        flex-direction: column;
        gap: 8px;
    }
    .waiting-item-time {
        text-align: left;
    }

    /* Day schedule */
    .day-schedule-header {
        padding: 14px 16px;
        flex-wrap: wrap;
        gap: 8px;
    }
    .time-slots {
        padding: 10px;
    }

    /* Slot items */
    .slot-booked {
        flex-wrap: wrap;
        padding: 10px;
    }

    /* Services grid */
    .services-grid {
        grid-template-columns: 1fr;
    }

    /* Quick actions: 4 cols → 3 cols */
    .quick-actions-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 6px;
    }

    /* Payment slots grid */
    .payment-slots-grid {
        grid-template-columns: 1fr;
    }

    /* Dropdown cards: panou lat, ancorat imediat sub topbar.
       Ancorarea se face cu `position: absolute` față de <header class="topbar">, care
       este `position: fixed` — deci e containing block pentru descendenții absoluți ȘI
       rămâne pe ecran la scroll. `top: 100%` preia automat înălțimea topbar-ului la
       fiecare breakpoint (68 / 52 / 48 / 44px), fără să o rescriem aici.

       ATENȚIE — NU folosi `position: fixed` aici: .topbar are `backdrop-filter`, iar un
       element cu backdrop-filter != none devine containing block și pentru descendenții
       `fixed` (la fel ca `transform`). Cu fixed, `bottom` se raporta la topbar, nu la
       viewport: panoul creștea în sus și ieșea tăiat deasupra ecranului, rămânând vizibil
       doar rândul de butoane. Cu `absolute` comportamentul e același în orice browser,
       indiferent de suportul pentru backdrop-filter. */
    .topbar-right,
    .dropdown-wrap {
        position: static;
    }
    .dropdown-card,
    .provider-wrap .dropdown-card,
    .notif-dropdown,
    .user-dropdown,
    #helpDropdown {
        position: absolute !important;
        top: 100% !important;
        bottom: auto !important;
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        margin-top: 8px;
        max-height: calc(100vh - 100px);
        overflow-y: auto;
        border-radius: 20px;
        /* opac: panoul stă peste conținut, iar la 98% se ghicea textul de dedesubt */
        background: #FFFFFF;
        box-shadow: 0 18px 60px rgba(0,0,0,0.20);
        z-index: 300 !important;
    }

    /* EQ report/detail cards */
    .eq-report-form,
    .eq-detail-form {
        grid-template-columns: 1fr !important;
    }

    /* Calendar mini: full width */
    .mini-calendar {
        padding: 14px;
    }

    /* Settings forms */
    .setup-grid,
    .setup-grid-3 {
        grid-template-columns: 1fr !important;
    }

    /* Sectii form grid */
    .mi-sec-form-grid {
        grid-template-columns: 1fr !important;
    }

    /* Pontaj cards */
    .pontaj-card-body,
    .pontaj-filters {
        flex-direction: column;
        gap: 8px;
    }

    /* Report filters */
    .report-filters,
    .report-controls {
        flex-direction: column;
        gap: 8px;
    }

    /* Table fix: reduce min-width for very basic tables */
    .table.table-simple {
        min-width: auto;
    }

    /* KV layout in dropdowns */
    .kv {
        flex-direction: column;
        gap: 2px;
    }
    .kv span:last-child {
        text-align: left;
    }

    /* Patient premium card: stack */
    .patient-premium-top {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    /* Extcas split: single col */
    .extcas-split {
        grid-template-columns: 1fr !important;
    }
}

/* ================================================================
   4. PHONE (≤ 576px)
   ================================================================ */
@media (max-width: 576px) {

    /* Body: no background gradients (performance) */
    body {
        background:
            linear-gradient(180deg, #F0F7F7 0%, var(--light-bg) 55%, #EEF5F5 100%);
    }

    /* Topbar: even more compact */
    .topbar, .topbar.topbar-premium {
        height: 52px;
        gap: 4px;
    }
    .app-shell {
        padding-top: 52px;
    }

    /* Hide provider pill entirely on very small screens */
    .provider-pill {
        display: none;
    }

    /* Search: full center space */
    .search-box {
        padding: 6px 10px;
    }
    .search-box input {
        font-size: 12px;
    }
    .search-box input::placeholder {
        font-size: 12px;
    }
    .search-box svg {
        width: 16px;
        height: 16px;
    }

    /* Content: tight padding */
    .content {
        padding: 8px;
    }

    /* Page title */
    .page-title {
        font-size: 18px;
    }
    .page-subtitle {
        font-size: 12px;
    }

    /* Cards: compact */
    .card {
        border-radius: 14px;
    }
    .card-body {
        padding: 12px;
    }
    .card-header {
        padding: 10px 12px;
    }

    /* Stat cards: more compact */
    .stat-card {
        padding: 12px;
        gap: 10px;
    }
    .stat-icon {
        width: 40px;
        height: 40px;
    }
    .stat-value {
        font-size: 20px;
    }
    .stat-label {
        font-size: 11px;
    }

    /* Stats premium */
    .stat-premium-card {
        padding: 14px;
    }
    .stat-premium-value {
        font-size: 22px;
    }

    /* Dashboard welcome */
    .welcome-banner {
        padding: 16px 14px;
    }
    .welcome-greeting {
        font-size: 14px;
    }
    .welcome-name {
        font-size: 20px;
    }

    /* Modal: true fullscreen */
    .modal-overlay {
        padding: 0;
    }
    .modal {
        border-radius: 0;
        max-height: 100vh;
        height: 100vh;
    }
    .modal-lg, .modal-xl, .modal-sm {
        max-width: 100%;
    }
    .modal-header {
        padding: 12px 14px;
    }
    .modal-body {
        padding: 14px;
    }
    .modal-title {
        font-size: 15px;
    }

    /* MI-modal: fullscreen */
    .mi-modal {
        padding: 0;
    }
    .mi-modal-content {
        border-radius: 0;
        max-height: 100vh;
        height: 100vh;
    }

    /* Form controls smaller */
    .form-control {
        padding: 10px 12px;
        font-size: 14px;
        border-radius: 10px;
    }

    /* Buttons compact */
    .btn {
        padding: 10px 16px;
        font-size: 13px;
        border-radius: 10px;
    }
    .btn-sm {
        padding: 8px 12px;
        font-size: 12px;
    }

    /* Quick actions: 2 cols */
    .quick-actions-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .quick-action {
        gap: 10px;
        padding: 12px 10px 12px 12px;
    }
    .quick-action-icon {
        width: 36px;
        height: 36px;
    }
    .quick-action-copy {
        padding-right: 14px;
    }
    .quick-action-title {
        font-size: 11px;
    }
    .quick-action-sub {
        font-size: 9.5px;
    }

    /* Consultation tabs: smaller */
    .consultation-tab {
        padding: 10px 12px;
        font-size: 0.82rem;
    }

    /* Day schedule: compact */
    .day-schedule-header {
        padding: 12px 14px;
    }
    .day-schedule-title {
        font-size: 15px;
    }

    /* Time slots: tighter */
    .time-slot {
        gap: 8px;
    }
    .time-slot-label {
        min-width: 42px;
        font-size: 12px;
    }

    /* Consultation header */
    .consultation-header-premium {
        padding: 12px 14px;
        margin: -12px -12px 0 -12px;
    }
    .consultation-header-premium .patient-avatar-header {
        width: 40px;
        height: 40px;
        font-size: 15px;
    }
    .consultation-header-premium .patient-header-details h2 {
        font-size: 1rem;
    }

    /* Tables: tighter cells */
    .table th {
        padding: 8px 10px;
        font-size: 11px;
    }
    .table td {
        padding: 10px;
        font-size: 13px;
    }

    /* Table avatars: smaller */
    .table-avatar {
        width: 32px;
        height: 32px;
        font-size: 10px;
    }
    .table-user {
        gap: 8px;
    }

    /* Badge compact */
    .badge {
        padding: 3px 8px;
        font-size: 10px;
    }

    /* Filters compact */
    .filters {
        padding: 10px;
    }

    /* Calendar */
    .calendar-day {
        font-size: 12px;
    }

    /* Sidebar: full width */
    .sidebar-premium {
        width: 100% !important;
        padding: 10px;
    }
    .sidebar-card {
        border-radius: 14px;
    }

    /* Header actions full width */
    .header-actions .btn {
        font-size: 12px;
        padding: 10px 14px;
    }

    /* Dropdowns on phone: more space
       (aceeași listă de selectori ca la 768px — altfel `.provider-wrap .dropdown-card`,
       cu specificitate mai mare, ar păstra marginile de 8px) */
    .dropdown-card,
    .provider-wrap .dropdown-card,
    .notif-dropdown,
    .user-dropdown,
    #helpDropdown {
        left: 4px !important;
        right: 4px !important;
        max-height: calc(100vh - 80px);
    }

    /* Services grid */
    .services-grid {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    /* Service card compact */
    .service-card {
        padding: 14px;
    }

    /* Payment pills: single column */
    .wk-payment-pills {
        grid-template-columns: 1fr !important;
    }

    /* Welcome actions */
    .btn-welcome {
        padding: 10px 14px;
        font-size: 13px;
    }

    /* Toast/SweetAlert: full width */
    .swal2-popup {
        width: calc(100vw - 24px) !important;
        padding: 16px !important;
        font-size: 14px !important;
    }

    /* Document types grid */
    .document-types-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* Waiting item */
    .waiting-item {
        padding: 10px;
    }

    /* All inline-actions: compact */
    .mi-inline-actions {
        gap: 6px;
    }
    .mi-inline-actions .btn.btn-icon {
        width: 36px;
        height: 36px;
    }

    /* Pontaj / reports specific */
    .mi-sec-stats {
        grid-template-columns: 1fr;
    }

    /* Extcas docs */
    .extcas-doc-row {
        grid-template-columns: 1fr;
    }

    /* Patient avatar large: smaller */
    .patient-avatar-large {
        width: 60px;
        height: 60px;
        font-size: 22px;
    }
}

/* ================================================================
   5. VERY SMALL PHONE (≤ 380px)
   ================================================================ */
@media (max-width: 380px) {

    .topbar, .topbar.topbar-premium {
        height: 48px;
        padding: 0 6px !important;
    }
    .app-shell {
        padding-top: 48px;
    }

    .topbar-hamburger {
        width: 34px;
        height: 34px;
    }

    .icon-btn {
        width: 34px;
        height: 34px;
    }

    .user-pill {
        padding: 6px;
    }
    .user-avatar-pill {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }

    .content {
        padding: 6px;
    }

    .page-title {
        font-size: 16px;
    }

    .card {
        border-radius: 12px;
    }
    .card-body {
        padding: 10px;
    }

    .stat-premium-card {
        padding: 12px;
    }

    .welcome-banner {
        padding: 14px 12px;
    }
    .welcome-name {
        font-size: 18px;
    }

    .btn {
        padding: 8px 12px;
        font-size: 12px;
    }

    .table th {
        padding: 6px 8px;
    }
    .table td {
        padding: 8px;
    }

    /* Quick actions: single column */
    .quick-actions-grid {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* ================================================================
   6. LANDSCAPE PHONE FIX (short height + wide)
   ================================================================ */
@media (max-height: 500px) and (orientation: landscape) {

    .topbar, .topbar.topbar-premium {
        height: 44px;
    }
    .app-shell {
        padding-top: 44px;
    }

    .modal {
        max-height: 100vh;
    }

    .sidebar-premium {
        top: 0;
        height: 100vh;
    }

    /* Less vertical spacing */
    .content {
        padding: 8px 12px;
    }
    .page-header {
        margin-bottom: 10px;
    }
    .welcome-banner {
        padding: 14px;
    }
}

/* ================================================================
   7. PRINT: hide non-essential mobile elements
   ================================================================ */
@media print {
    .sidebar-mobile-toggle,
    .sidebar-overlay,
    .sidebar-premium,
    .topbar,
    .mi-scroll-toggle {
        display: none !important;
    }
    .main, .main-content {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* ================================================================
   8. SAFE AREA INSETS (notch devices)
   ================================================================ */
@supports (padding: env(safe-area-inset-top)) {
    .topbar {
        padding-top: env(safe-area-inset-top);
    }
    .sidebar-premium {
        padding-bottom: env(safe-area-inset-bottom);
    }
    .modal-footer {
        padding-bottom: calc(12px + env(safe-area-inset-bottom));
    }
    .dropdown-card {
        margin-bottom: env(safe-area-inset-bottom);
    }
}

/* ================================================================
   9. ACCESSIBILITY — Reduced Motion
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ================================================================
   10. EXTRA: Scrollable table wrapper helper class
   Use .mi-table-responsive around tables for guaranteed mobile scroll
   ================================================================ */
.mi-table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
}
.mi-table-responsive > .table {
    min-width: 600px;
}

/* Scrollbar for horizontal scroll areas */
.mi-table-responsive::-webkit-scrollbar,
.consultation-tabs-container::-webkit-scrollbar,
.tabs::-webkit-scrollbar,
.filters::-webkit-scrollbar {
    height: 4px;
}
.mi-table-responsive::-webkit-scrollbar-thumb,
.consultation-tabs-container::-webkit-scrollbar-thumb,
.tabs::-webkit-scrollbar-thumb,
.filters::-webkit-scrollbar-thumb {
    background: rgba(81,127,137,0.3);
    border-radius: 2px;
}

/* ================================================================
   11. BOTTOM SHEET STYLE DROPDOWNS (mobile enhancement)
   ================================================================ */
@media (max-width: 768px) {

    /* Add overlay effect when dropdown is open */
    .dropdown-card[style*="display: block"],
    .dropdown-card[style*="display:block"] {
        animation: slideUpSheet 0.25s ease;
    }

    /* Panoul coboară de sub topbar, nu mai urcă de jos */
    @keyframes slideUpSheet {
        from {
            opacity: 0;
            transform: translateY(-12px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* ================================================================
   12. TOUCH-FRIENDLY INTERACTIVE STATES
   ================================================================ */
@media (hover: none) and (pointer: coarse) {
    /* Remove hover effects that don't work on touch */
    .stat-card:hover,
    .service-card:hover,
    .slot-booked:hover {
        transform: none;
    }

    /* Larger tap targets */
    .nav-item {
        padding: 14px 14px;
    }

    /* Remove fine-pointer hover animations */
    .sidebar-logo-icon:hover {
        transform: none;
    }

    /* Active states for touch feedback */
    .btn:active {
        transform: scale(0.97);
        opacity: 0.9;
    }

    .nav-item:active {
        background: rgba(255, 255, 255, 0.15);
    }

    .icon-btn:active {
        transform: scale(0.95);
    }
}

/* ═══════════════════════════════════════════════════════════
   PREMIUM COMPACT PATIENT TAB  (consultation + assistant)
   ═══════════════════════════════════════════════════════════ */
.pt-tab-compact { display: flex; flex-direction: column; gap: 14px; animation: ptFadeUp .35s ease; }
@keyframes ptFadeUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

/* ── Hero strip ── */
.pt-hero {
    display: flex; align-items: stretch; gap: 0;
    background: var(--surface-strong, #fff);
    border-radius: 18px; border: 1px solid var(--border-soft);
    overflow: hidden; box-shadow: 0 2px 12px rgba(52,85,93,.06);
}
.pt-hero-left { display: flex; align-items: center; gap: 14px; padding: 16px 20px; flex: 1; min-width: 0; }
.pt-avatar-c {
    width: 50px; height: 50px; border-radius: 14px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; font-weight: 700; color: #fff; flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(52,85,93,.22);
}
.pt-identity-c { flex: 1; min-width: 0; }
.pt-name-c { font-size: 16px; font-weight: 700; color: var(--negru); line-height: 1.25; margin-bottom: 2px; }
.pt-meta-c { font-size: 12px; color: var(--violet-cenusiu); display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.pt-meta-c .sep { opacity: .35; }
.pt-tags-c { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.pt-tag-c {
    display: inline-flex; align-items: center; gap: 3px;
    padding: 2px 9px; border-radius: 20px; font-size: 11px; font-weight: 600;
    background: color-mix(in srgb, var(--tag-color) 10%, transparent);
    color: var(--tag-color);
    border: 1px solid color-mix(in srgb, var(--tag-color) 14%, transparent);
}
.pt-tag-c svg { width: 10px; height: 10px; }
.pt-hero-divider {
    width: 1px; flex-shrink: 0;
    background: linear-gradient(to bottom, transparent 12%, var(--border-soft) 35%, var(--border-soft) 65%, transparent 88%);
}
.pt-hero-stats { display: flex; gap: 0; flex-shrink: 0; }
.pt-stat-box {
    padding: 16px 20px; text-align: center;
    display: flex; flex-direction: column; justify-content: center; min-width: 88px;
    position: relative;
}
.pt-stat-box + .pt-stat-box::before {
    content: ''; position: absolute; left: 0; top: 25%; height: 50%;
    width: 1px; background: var(--border-soft);
}
.pt-stat-val { font-size: 21px; font-weight: 800; color: var(--albastru-verzui-moderat); line-height: 1; }
.pt-stat-val.date { font-size: 13px; font-weight: 700; }
.pt-stat-label {
    font-size: 10px; font-weight: 600; color: var(--violet-cenusiu);
    text-transform: uppercase; letter-spacing: .5px; margin-top: 3px;
}

/* ── Allergies bar ── */
.pt-allergies-bar {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 14px;
    background: linear-gradient(135deg, rgba(231,76,60,.05), rgba(231,76,60,.02));
    border: 1px solid rgba(231,76,60,.1);
    border-radius: 14px;
}
.pt-allergy-ico {
    width: 28px; height: 28px; border-radius: 9px;
    background: rgba(231,76,60,.08); display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.pt-allergy-ico svg { width: 14px; height: 14px; color: #c0392b; }
.pt-allergy-lbl { font-size: 12px; font-weight: 700; color: #c0392b; white-space: nowrap; }
.pt-allergy-chips { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.pt-allergy-chip { padding: 2px 9px; border-radius: 8px; font-size: 11px; font-weight: 600; }
.pt-allergy-chip.danger  { background: rgba(231,76,60,.1); color: #c0392b; }
.pt-allergy-chip.warning { background: rgba(243,156,18,.1); color: #d68910; }
.pt-allergy-chip.info    { background: rgba(46,204,113,.1); color: #27ae60; }
.pt-blood-chip-c {
    padding: 2px 9px; border-radius: 8px; font-size: 11px; font-weight: 600;
    background: rgba(81,127,137,.08); color: var(--verde-albastrui-moderat);
    margin-left: auto; flex-shrink: 0;
}

/* ── Duo columns ── */
.pt-duo-c { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pt-card-c {
    background: var(--surface-strong, #fff); border-radius: 16px;
    border: 1px solid var(--border-soft); padding: 14px 16px;
    transition: all .2s ease; box-shadow: 0 1px 6px rgba(52,85,93,.03);
}
.pt-card-c:hover { border-color: rgba(81,127,137,.22); box-shadow: 0 4px 16px rgba(52,85,93,.07); }
.pt-card-head-c {
    display: flex; align-items: center; gap: 7px;
    margin-bottom: 10px; font-size: 11px; font-weight: 700;
    color: var(--violet-cenusiu); text-transform: uppercase; letter-spacing: .4px;
}
.pt-card-ico-c {
    width: 26px; height: 26px; border-radius: 8px;
    background: linear-gradient(135deg, rgba(52,85,93,.07), rgba(81,127,137,.05));
    display: flex; align-items: center; justify-content: center;
    color: var(--verde-albastrui-moderat);
}
.pt-card-ico-c svg { width: 13px; height: 13px; }

/* Contact items */
.pt-contacts-c { display: flex; flex-direction: column; gap: 6px; }
.pt-contact-c {
    display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--negru);
    padding: 5px 9px; border-radius: 9px; background: rgba(81,127,137,.025);
    transition: background .15s ease;
}
.pt-contact-c:hover { background: rgba(81,127,137,.06); }
.pt-c-ico {
    width: 26px; height: 26px; border-radius: 7px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; background: rgba(81,127,137,.06); color: var(--verde-albastrui-moderat);
}
.pt-c-ico svg { width: 13px; height: 13px; }
.pt-c-lbl { font-size: 10px; color: var(--violet-cenusiu); font-weight: 500; }
.pt-c-val { font-size: 13px; color: var(--negru); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Detail rows */
.pt-details-c { display: flex; flex-direction: column; }
.pt-drow {
    display: flex; justify-content: space-between; align-items: baseline;
    /* gap explicit: fără el, o valoare care se rupe pe două rânduri (ex. adresa)
       se lipea de etichetă, pentru că space-between nu lasă spațiu între ele. */
    gap: 14px;
    padding: 6px 0; border-bottom: 1px solid rgba(81,127,137,.05); font-size: 13px;
}
.pt-drow:last-child { border-bottom: none; }
.pt-drow .dl { color: var(--violet-cenusiu); font-weight: 500; flex: 0 0 auto; }
.pt-drow .dv { color: var(--negru); font-weight: 600; text-align: right; min-width: 0; }
.pt-dbadge {
    display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 8px;
    font-size: 12px; font-weight: 600;
}

/* ── Quick actions row ── */
.pt-actions-c { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pt-action-c {
    display: flex; align-items: center; gap: 9px;
    padding: 11px 12px; background: var(--surface-strong, #fff);
    border: 1px solid var(--border-soft); border-radius: 13px;
    cursor: pointer; transition: all .2s ease; text-decoration: none; color: var(--negru);
    box-shadow: 0 1px 4px rgba(52,85,93,.03);
}
.pt-action-c:hover {
    border-color: var(--verde-albastrui-moderat); transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(52,85,93,.09); text-decoration: none; color: var(--negru);
}
.pt-a-ico {
    width: 34px; height: 34px; border-radius: 10px;
    background: linear-gradient(135deg, rgba(52,85,93,.07), rgba(81,127,137,.05));
    display: flex; align-items: center; justify-content: center;
    color: var(--verde-albastrui-moderat); flex-shrink: 0; transition: all .2s ease;
}
.pt-action-c:hover .pt-a-ico {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: #fff; box-shadow: 0 3px 10px rgba(52,85,93,.18);
}
.pt-a-ico svg { width: 15px; height: 15px; }
.pt-a-text { font-size: 12px; font-weight: 600; line-height: 1.3; }
.pt-a-sub { font-size: 10px; color: var(--violet-cenusiu); font-weight: 500; margin-top: 1px; }

/* ── Total banner (assistant) ── */
.pt-total-banner {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 18px; border-radius: 14px;
    background: linear-gradient(135deg, rgba(52,85,93,.04), rgba(81,127,137,.03));
    border: 1px solid var(--border-soft);
}
.pt-total-left { display: flex; align-items: center; gap: 10px; }
.pt-total-ico {
    width: 34px; height: 34px; border-radius: 10px;
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    display: flex; align-items: center; justify-content: center; color: #fff;
}
.pt-total-ico svg { width: 16px; height: 16px; }
.pt-total-label { font-size: 12px; color: var(--violet-cenusiu); font-weight: 500; }
.pt-total-sub { font-size: 11px; color: var(--violet-cenusiu); }
.pt-total-val { font-size: 22px; font-weight: 800; color: var(--albastru-verzui-moderat); }

/* ── Responsive ── */
@media (max-width: 900px) {
    .pt-actions-c { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .pt-hero { flex-direction: column; }
    .pt-hero-divider { width: 100%; height: 1px; background: var(--border-soft); }
    .pt-hero-stats { justify-content: center; padding: 4px 0 8px; }
    .pt-duo-c { grid-template-columns: 1fr; }
    .pt-actions-c { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .pt-actions-c { grid-template-columns: 1fr; }
    .pt-hero-stats { flex-wrap: wrap; }
    .pt-stat-box { min-width: 70px; padding: 12px 14px; }
}


/* ===== Patient Tab: Info Medical card (consultation) ===== */
.pt-medical-card .pt-medical-body { padding: 4px 0 2px; }
.pt-medical-card .pt-med-section { padding: 10px 0; border-top: 1px dashed rgba(81,127,137,.18); }
.pt-medical-card .pt-med-section:first-child { border-top: 0; padding-top: 0; }
.pt-medical-card .pt-med-section:last-child { padding-bottom: 0; }
.pt-medical-card h4 { margin: 0 0 8px; font-size: 12.5px; font-weight: 800; color: var(--albastru-verzui-moderat); }
.pt-med-empty { margin: 0; font-size: 12px; color: var(--violet-cenusiu); }
.pt-med-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pt-med-chip { padding: 2px 9px; border-radius: 8px; font-size: 11px; font-weight: 650; background: rgba(81,127,137,.08); color: var(--albastru-verzui-moderat); }
.pt-med-chip.info { background: rgba(111,66,193,.10); color: #5a3aa8; }

.pt-med-head { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 6px; font-size: 11px; color: var(--violet-cenusiu); }
.pt-med-head-right { display: inline-flex; gap: 10px; justify-content: flex-end; min-width: 140px; }
.pt-medications { display: flex; flex-direction: column; gap: 6px; }
.pt-med-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 8px 0; border-top: 1px solid rgba(0,0,0,0.05); }
.pt-med-row:first-child { border-top: 0; padding-top: 0; }
.pt-med-left { min-width: 0; }
.pt-med-name { display: inline-block; font-size: 12px; font-weight: 750; color: var(--albastru-verzui-inchis); line-height: 1.25; }
.pt-med-right { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; min-width: 140px; }
.pt-med-pill { padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 650; background: rgba(81,127,137,.10); color: var(--albastru-verzui-moderat); }
.pt-med-pill.ghost { background: rgba(0,0,0,.05); color: var(--violet-cenusiu); }

/* ============================================================
   COMPREHENSIVE RESPONSIVE FIXES v1819
   ============================================================ */

/* --- Notifications Page --- */
.notif-list { display: flex; flex-direction: column; gap: 10px; }
.notif-card { margin: 0; border: 1px solid rgba(81,127,137,0.12); background: rgba(255,255,255,0.9); border-radius: 14px; }
.notif-card .card-body { padding: 14px 16px; }
.notif-row { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.notif-type { font-weight: 700; margin-bottom: 4px; }
.notif-msg { color: var(--dark-text); }
.notif-meta { text-align: right; color: var(--violet-cenusiu); font-size: 12px; white-space: nowrap; }
.notif-badge { margin-top: 6px; display: inline-flex; padding: 4px 8px; border-radius: 999px; font-weight: 600; font-size: 12px; }
.notif-badge.read { background: rgba(39,174,96,0.12); color: var(--success); }
.notif-badge.new { background: rgba(243,156,18,0.14); color: var(--warning); }

@media (max-width: 640px) {
    .notif-row { flex-direction: column; gap: 8px; }
    .notif-meta { text-align: left; display: flex; align-items: center; gap: 10px; white-space: normal; }
    .notif-badge { margin-top: 0; }
}

/* --- Suppliers Page --- */
@media (max-width: 768px) {
    .suppliers-search-form { flex-direction: column !important; }
    .suppliers-search-form .search-box { max-width: 100% !important; }
}

/* --- Consultation Assistant inline fix --- */
.ca-services-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.ca-field-service { min-width: 200px; flex: 2; }
.ca-field-qty { width: 110px; min-width: 80px; }
.ca-field-price { width: 130px; min-width: 90px; }
.ca-field-notes { min-width: 160px; flex: 1; }
.ca-field-label { display: block; font-size: 12px; color: #64748b; margin-bottom: 6px; }
.ca-field-input { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid #e2e8f0; font-family: inherit; font-size: 14px; background: #fff; transition: border-color .2s; }
.ca-field-input:focus { outline: none; border-color: var(--albastru-verzui-moderat); }
.ca-actions-row { margin-top: 10px; display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 768px) {
    .ca-services-row { gap: 10px; }
    .ca-field-service { min-width: 100%; flex-basis: 100%; }
    .ca-field-qty,
    .ca-field-price { width: calc(50% - 5px); min-width: 0; flex: 1; }
    .ca-field-notes { min-width: 100%; flex-basis: 100%; }
}

@media (max-width: 480px) {
    .ca-field-qty,
    .ca-field-price { width: 100%; flex-basis: 100%; }
}

/* --- Consultation inline fixed widths --- */
.consult-serial-input { display: inline-block; width: 220px; max-width: 100%; }
.consult-doc-filter { width: 180px; max-width: 100%; }

@media (max-width: 768px) {
    .consult-serial-input { width: 100%; display: block; }
    .consult-doc-filter { width: 100%; }
    .consultation-premium-container .form-group[style*="min-width:260px"] { min-width: auto !important; flex-basis: 100% !important; }
}

/* --- Appointments Print screen responsive --- */
@media screen and (max-width: 768px) {
    .print-appointments-wrap { padding: 10px; }
    .print-header { flex-direction: column; gap: 10px; }
    .ph-logo { width: 48px; height: 48px; }
    .ph-name { font-size: 15px; }
    .print-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .print-table { min-width: 650px; }
    .print-table th,
    .print-table td { padding: 6px 5px; font-size: 11px; }
    .print-actions { flex-wrap: wrap; }
    .print-actions .btn { flex: 1; min-width: 120px; text-align: center; justify-content: center; }
}

@media screen and (max-width: 480px) {
    .print-appointments-wrap { padding: 6px; }
    .ph-filters { flex-direction: column; gap: 4px; }
    .day-title { flex-direction: column; align-items: flex-start; gap: 2px; }
}

/* --- Assistant Activities responsive --- */
@media (max-width: 768px) {
    .aa-toolbar { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
    .aa-toolbar .form-control[style*="min-width:260px"],
    .aa-toolbar input[style*="min-width:260px"] { min-width: 0 !important; width: 100% !important; }
    .aa-toolbar select[style*="max-width:260px"] { max-width: 100% !important; width: 100% !important; }
    .aa-summary { flex-direction: column; }
    .aa-summary .col { min-width: auto !important; }
}

/* --- Settings Import SQL responsive --- */
@media (max-width: 768px) {
    .mi-import-section .form-group[style*="min-width"] { min-width: auto !important; flex: 1 1 100% !important; }
    .mi-import-tabs { flex-wrap: wrap; }
    .mi-import-tabs .btn,
    .mi-import-tabs button { flex: 1; min-width: 100px; text-align: center; justify-content: center; font-size: 12px; }
    .mi-import-section [style*="display:flex"][style*="gap"] { flex-wrap: wrap !important; }
}

@media (max-width: 480px) {
    .mi-import-section .form-group[style*="min-width"] { width: 100% !important; }
}

/* --- Consultation tables (prescriptions, echo) responsive --- */
@media (max-width: 900px) {
    .consultation-premium-container th[style*="min-width:240px"],
    .consultation-premium-container th[style*="min-width:200px"],
    .consultation-premium-container th[style*="min-width:180px"],
    .consultation-premium-container th[style*="min-width:160px"],
    .consultation-premium-container th[style*="min-width:140px"],
    .consultation-premium-container th[style*="min-width:120px"],
    .consultation-premium-container th[style*="min-width:110px"] {
        min-width: auto !important;
    }
}

/* --- Equipment detail panel mobile --- */
@media (max-width: 640px) {
    .eq-detail-panel { width: 100vw !important; max-width: 100vw !important; }
}

/* --- Settings (main) panel mobile --- */
@media (max-width: 768px) {
    .settings-panel th[style*="min-width"] { min-width: auto !important; }
    .settings-panel .table-container { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* --- Sections/Secții responsive extra --- */
@media (max-width: 640px) {
    .sc-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
    .sc-toolbar-left { min-width: auto !important; }
    .sc-search-wrap { max-width: 100% !important; }
}

/* --- Settings Echipamente responsive extra --- */
@media (max-width: 640px) {
    .seq-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
    .seq-toolbar-left { min-width: auto !important; }
    .seq-search-wrap { max-width: 100% !important; }
}

/* --- Form Row global responsive (suppliers, etc.) --- */
@media (max-width: 640px) {
    .form-row { flex-direction: column; gap: 0; }
    .form-row .form-group { width: 100%; }
}

/* --- Quick Grid responsive (suppliers view, etc.) --- */
@media (max-width: 768px) {
    .quick-grid { grid-template-columns: 1fr !important; }
}

/* --- Medical History timeline responsive extra --- */
@media (max-width: 640px) {
    .mh-stats-grid { grid-template-columns: 1fr !important; gap: 10px; }
}

/* --- General table th min-width override for mobile --- */
@media (max-width: 640px) {
    th[style*="min-width:260px"],
    th[style*="min-width:220px"],
    th[style*="min-width:200px"],
    th[style*="min-width:180px"],
    th[style*="min-width:160px"] {
        min-width: auto !important;
    }
}

/* --- Pontaj table responsive extra --- */
@media (max-width: 640px) {
    .pontaj-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
    .pontaj-month-label { min-width: auto !important; }
    .pontaj-search { max-width: 100% !important; min-width: auto !important; }
}

/* --- Page header actions on very small screens --- */
@media (max-width: 480px) {
    .page-header .header-actions { width: 100%; }
    .page-header .header-actions .btn { flex: 1; text-align: center; justify-content: center; }
    .page-header .header-actions a.btn { text-align: center; }
}

/* --- Global: prevent ANY element from overflowing main content --- */
html { overflow-x: hidden; }
body { overflow-x: hidden; }
.app { overflow-x: hidden; }
.app-shell { overflow-x: hidden; min-width: 0; }
.main { overflow-x: hidden; min-width: 0; }
.main-content { overflow-x: hidden; min-width: 0; }
.content { overflow-x: hidden; }
.content > * { max-width: 100%; box-sizing: border-box; }
.content * { max-width: 100%; }

/* Exceptions: elements that need to overflow (scrollable containers) */
.content pre,
.content code,
.content .table-container,
.content .table-responsive,
.content table,
.content .tabs-header-premium,
.content .week-days-header,
.content input,
.content select,
.content textarea,
.content canvas,
.content svg { max-width: none; }

/* Grid/flex children need min-width: 0 to respect container bounds */
.content [class*="-premium"],
.content [class*="-card"],
.content [class*="-sidebar"],
.content [class*="-main"],
.content [class*="-content"],
.content [class*="-layout"],
.content [class*="-grid"] {
    min-width: 0;
    box-sizing: border-box;
}

/* --- Table containers always scrollable --- */
.table-container,
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --- Consultation assistant info-grid --- */
@media (max-width: 768px) {
    .info-grid-premium { grid-template-columns: 1fr !important; }
}

/* --- Consultation header new responsive --- */
@media (max-width: 640px) {
    .consultation-header-new { flex-direction: column; gap: 12px; }
    .consultation-header-registry {
        width: 100%;
        justify-content: center;
        text-align: center;
        flex-wrap: wrap;
        padding: 10px 16px;
        /* IMPORTANT: containerul devine coloană mai sus, iar `flex: 1 1 280px`
           din regula de bază ar fi interpretat ca ÎNĂLȚIME de 280px, nu lățime.
           Rezulta o cutie aproape goală, de 280px, în capul paginii. */
        flex: 0 0 auto;
        min-height: 0;
    }
    /* Eticheta și valoarea rămân pe același rând — „Nr. Registru: 2" */
    .consultation-header-registry .registry-label,
    .consultation-header-registry .registry-value {
        width: auto;
    }
    .consultation-header-registry .registry-value { font-size: 1.4rem; }
    .header-actions-new { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; }
    .header-actions-new .btn { flex: 1; min-width: 100px; text-align: center; justify-content: center; }
}

/* --- Patient card in consultation_assistant --- */
@media (max-width: 768px) {
    .patient-info-premium .info-grid-premium { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .patient-info-premium .info-grid-premium { grid-template-columns: 1fr; }
}

/* --- Fix flex children with inline width on mobile --- */
@media (max-width: 640px) {
    [style*="width:110px"],
    [style*="width: 110px"],
    [style*="width:130px"],
    [style*="width: 130px"] {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 !important;
    }
    [style*="min-width:280px"],
    [style*="min-width: 280px"],
    [style*="min-width:260px"],
    [style*="min-width: 260px"],
    [style*="min-width:220px"],
    [style*="min-width: 220px"] {
        min-width: auto !important;
        width: 100% !important;
    }
}

/* --- Print page actions mobile --- */
@media screen and (max-width: 640px) {
    .print-actions { flex-direction: column; }
    .print-actions .btn { width: 100%; }
}

/* ============================================================
   RESPONSIVE: ALL DOCUMENT PREVIEW MODALS
   Covers: docPreviewModal, appointmentsPrintModal, and
   any .modal-doc-preview / .modal-xl with iframe previews
   ============================================================ */

/* ── Tablet (≤ 768px) ── */
@media (max-width: 768px) {
    /* Generic modal overlay – less padding on mobile */
    .modal-overlay {
        padding: 8px !important;
    }

    /* Document preview modal (consultation + patients) */
    .modal-doc-preview {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }
    .modal-doc-preview .doc-preview-header {
        padding: 12px 14px !important;
        gap: 8px;
    }
    .modal-doc-preview .doc-preview-header .modal-title {
        font-size: 14px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
        flex: 1;
    }
    .modal-doc-preview .doc-preview-body {
        height: calc(100vh - 52px) !important;
        height: calc(100dvh - 52px) !important;
    }
    .modal-doc-preview iframe {
        border-radius: 0 !important;
    }

    /* Appointments print modal */
    #appointmentsPrintModal .modal.modal-xl {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }
    #appointmentsPrintModal .modal-header {
        padding: 12px 14px !important;
        gap: 8px;
    }
    #appointmentsPrintModal .modal-header .modal-title {
        font-size: 14px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
        flex: 1;
    }
    #appointmentsPrintModal .modal-body iframe {
        height: calc(100vh - 52px) !important;
        height: calc(100dvh - 52px) !important;
    }

    /* All generic modals: ensure they don't overflow on mobile */
    .modal-lg,
    .modal-xl {
        max-width: 100vw !important;
    }
}

/* ── Small phones (≤ 480px) ── */
@media (max-width: 480px) {
    .modal-doc-preview .doc-preview-header,
    #appointmentsPrintModal .modal-header {
        padding: 10px 12px !important;
    }
    .modal-doc-preview .doc-preview-header .modal-title,
    #appointmentsPrintModal .modal-header .modal-title {
        font-size: 13px !important;
    }
    .modal-doc-preview .doc-preview-actions .btn,
    #appointmentsPrintModal .modal-header .btn {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
    .modal-doc-preview .doc-preview-body {
        height: calc(100vh - 46px) !important;
        height: calc(100dvh - 46px) !important;
    }
    #appointmentsPrintModal .modal-body iframe {
        height: calc(100vh - 46px) !important;
        height: calc(100dvh - 46px) !important;
    }
}


/* v2012 - responsive premium mobile layout for multi-status filters */
@media (max-width: 768px) {
    .status-multifilter[open] {
        z-index: 10040;
    }

    .status-multifilter-sidebar .status-filter-menu {
        position: fixed;
        left: max(12px, env(safe-area-inset-left));
        right: max(12px, env(safe-area-inset-right));
        top: auto;
        bottom: max(12px, env(safe-area-inset-bottom));
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: min(74vh, 640px);
        padding: 16px;
        border-radius: 24px;
        box-shadow: 0 24px 64px rgba(20, 40, 52, 0.28);
        overscroll-behavior: contain;
    }

    .status-multifilter-sidebar .status-filter-menu-title {
        position: sticky;
        top: -16px;
        z-index: 2;
        margin: -16px -16px 12px;
        padding: 16px 16px 12px;
        background: linear-gradient(180deg, rgba(255,255,255,0.985) 0%, rgba(255,255,255,0.94) 100%);
        border-bottom: 1px solid rgba(81,127,137,0.08);
        border-radius: 24px 24px 0 0;
        font-size: 12px;
        line-height: 1.45;
    }

    .status-multifilter-sidebar .status-filter-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .status-multifilter-sidebar .status-filter-option {
        min-height: 58px;
        padding: 10px 12px;
        border-radius: 15px;
        align-items: center;
        gap: 10px;
    }

    .status-multifilter-sidebar .status-filter-option input {
        width: 17px;
        height: 17px;
    }

    .status-multifilter-sidebar .status-filter-option .appointment-status {
        min-height: 36px;
        padding: 8px 10px;
        font-size: 12px;
        line-height: 1.2;
        border-radius: 12px;
    }

    .status-multifilter-sidebar .status-filter-presets {
        position: sticky;
        bottom: 54px;
        z-index: 2;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin-top: 14px;
        padding: 12px 0 10px;
        background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.985) 32%);
    }

    .status-multifilter-sidebar .status-filter-footer {
        position: sticky;
        bottom: -16px;
        z-index: 2;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        margin-top: 0;
        padding: 10px 0 0;
        background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.985) 32%);
    }

    .status-multifilter-sidebar .status-preset-btn,
    .status-multifilter-sidebar .status-filter-link,
    .status-multifilter-sidebar .status-filter-apply {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 12px;
        border-radius: 14px;
    }
}

@media (max-width: 480px) {
    .status-filter-menu {
        width: min(100vw - 20px, 420px);
    }

    .status-multifilter-sidebar .status-filter-menu {
        left: max(10px, env(safe-area-inset-left));
        right: max(10px, env(safe-area-inset-right));
        bottom: max(10px, env(safe-area-inset-bottom));
        max-height: min(76vh, 620px);
        padding: 14px;
        border-radius: 22px;
    }

    .status-multifilter-sidebar .status-filter-menu-title {
        top: -14px;
        margin: -14px -14px 10px;
        padding: 14px 14px 10px;
        border-radius: 22px 22px 0 0;
    }

    .status-multifilter-sidebar .status-filter-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .status-multifilter-sidebar .status-filter-option {
        min-height: 54px;
        padding: 9px 10px;
        gap: 8px;
    }

    .status-multifilter-sidebar .status-filter-option .appointment-status {
        min-height: 34px;
        padding: 7px 8px;
        font-size: 11px;
    }

    .status-multifilter-sidebar .status-filter-presets {
        bottom: 52px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        padding: 10px 0 8px;
    }

    .status-multifilter-sidebar .status-filter-footer {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
    }

    .status-multifilter-sidebar .status-preset-btn,
    .status-multifilter-sidebar .status-filter-link,
    .status-multifilter-sidebar .status-filter-apply {
        min-height: 42px;
        padding: 9px 10px;
        font-size: 11px;
    }
}

@media (max-width: 360px) {
    .status-multifilter-sidebar .status-filter-options,
    .status-multifilter-sidebar .status-filter-presets,
    .status-multifilter-sidebar .status-filter-footer {
        grid-template-columns: 1fr;
    }

    .status-multifilter-sidebar .status-filter-presets {
        bottom: 96px;
    }
}


/* v2013 - mobile bottom-sheet for all multi-status filters */
@media (max-width: 768px) {
    .status-multifilter[open]::before {
        content: '';
        position: fixed;
        inset: 0;
        background: rgba(24, 36, 46, 0.28);
        backdrop-filter: blur(4px);
        z-index: 10030;
    }

    .status-multifilter .status-filter-menu,
    .status-multifilter-sidebar .status-filter-menu {
        position: fixed;
        left: max(10px, env(safe-area-inset-left));
        right: max(10px, env(safe-area-inset-right));
        top: auto;
        bottom: max(10px, env(safe-area-inset-bottom));
        width: auto !important;
        min-width: 0 !important;
        max-width: none;
        max-height: min(78vh, 680px);
        max-height: min(78dvh, 680px);
        padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
        border-radius: 24px;
        box-shadow: 0 28px 72px rgba(18, 38, 50, 0.30);
        z-index: 10050;
        overscroll-behavior: contain;
    }

    .status-multifilter .status-filter-menu-title,
    .status-multifilter-sidebar .status-filter-menu-title {
        position: sticky;
        top: -16px;
        z-index: 2;
        margin: -16px -16px 12px;
        padding: 16px 16px 12px;
        background: linear-gradient(180deg, rgba(255,255,255,0.99) 0%, rgba(255,255,255,0.96) 100%);
        border-bottom: 1px solid rgba(81,127,137,0.10);
        border-radius: 24px 24px 0 0;
        font-size: 12px;
        line-height: 1.45;
    }

    .status-multifilter .status-filter-options,
    .status-multifilter-sidebar .status-filter-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .status-multifilter .status-filter-option,
    .status-multifilter-sidebar .status-filter-option {
        min-height: 58px;
        padding: 10px 12px;
        gap: 10px;
        align-items: center;
        border-radius: 15px;
    }

    .status-multifilter .status-filter-option input,
    .status-multifilter-sidebar .status-filter-option input {
        width: 17px;
        height: 17px;
    }

    .status-multifilter .status-filter-option .appointment-status,
    .status-multifilter-sidebar .status-filter-option .appointment-status {
        min-height: 36px;
        padding: 8px 10px;
        border-radius: 12px;
        font-size: 12px;
        line-height: 1.2;
    }

    .status-multifilter .status-filter-presets,
    .status-multifilter-sidebar .status-filter-presets {
        position: sticky;
        bottom: 56px;
        z-index: 2;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin-top: 14px;
        padding: 12px 0 10px;
        background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.985) 30%);
        border-top: 1px solid rgba(81,127,137,0.08);
    }

    .status-multifilter .status-filter-footer,
    .status-multifilter-sidebar .status-filter-footer {
        position: sticky;
        bottom: calc(-16px - env(safe-area-inset-bottom));
        z-index: 2;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        margin-top: 0;
        padding: 10px 0 0;
        background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.985) 30%);
    }

    .status-multifilter .status-preset-btn,
    .status-multifilter .status-filter-link,
    .status-multifilter .status-filter-apply,
    .status-multifilter-sidebar .status-preset-btn,
    .status-multifilter-sidebar .status-filter-link,
    .status-multifilter-sidebar .status-filter-apply {
        width: 100%;
        min-height: 44px;
        padding: 10px 12px;
        font-size: 12px;
        border-radius: 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .status-multifilter .status-filter-menu,
    .status-multifilter-sidebar .status-filter-menu {
        left: max(8px, env(safe-area-inset-left));
        right: max(8px, env(safe-area-inset-right));
        bottom: max(8px, env(safe-area-inset-bottom));
        max-height: min(80vh, 680px);
        max-height: min(80dvh, 680px);
        padding: 14px 14px calc(14px + env(safe-area-inset-bottom));
        border-radius: 22px;
    }

    .status-multifilter .status-filter-menu-title,
    .status-multifilter-sidebar .status-filter-menu-title {
        top: -14px;
        margin: -14px -14px 10px;
        padding: 14px 14px 10px;
        border-radius: 22px 22px 0 0;
    }

    .status-multifilter .status-filter-options,
    .status-multifilter-sidebar .status-filter-options {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .status-multifilter .status-filter-option,
    .status-multifilter-sidebar .status-filter-option {
        min-height: 54px;
        padding: 9px 10px;
        gap: 8px;
    }

    .status-multifilter .status-filter-option .appointment-status,
    .status-multifilter-sidebar .status-filter-option .appointment-status {
        min-height: 34px;
        padding: 7px 9px;
        font-size: 11px;
    }

    .status-multifilter .status-filter-presets,
    .status-multifilter-sidebar .status-filter-presets {
        bottom: 52px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        padding: 10px 0 8px;
    }

    .status-multifilter .status-filter-footer,
    .status-multifilter-sidebar .status-filter-footer {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
    }

    .status-multifilter .status-preset-btn,
    .status-multifilter .status-filter-link,
    .status-multifilter .status-filter-apply,
    .status-multifilter-sidebar .status-preset-btn,
    .status-multifilter-sidebar .status-filter-link,
    .status-multifilter-sidebar .status-filter-apply {
        min-height: 42px;
        padding: 9px 10px;
        font-size: 11px;
    }
}

@media (max-width: 360px) {
    .status-multifilter .status-filter-presets,
    .status-multifilter .status-filter-footer,
    .status-multifilter-sidebar .status-filter-presets,
    .status-multifilter-sidebar .status-filter-footer {
        grid-template-columns: 1fr;
    }

    .status-multifilter .status-filter-presets,
    .status-multifilter-sidebar .status-filter-presets {
        bottom: 96px;
    }
}


/* CAS extern bridge status */
.extcas-card-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.extcas-card-title-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.extcas-status-badge{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid rgba(52,85,93,.16);background:#f3f7f7;color:#47636a;box-shadow:0 6px 16px rgba(52,85,93,.06)}
.extcas-status-badge.is-online{background:rgba(22,163,74,.10);color:#15803d;border-color:rgba(22,163,74,.18)}
.extcas-status-badge.is-offline{background:rgba(220,38,38,.08);color:#b91c1c;border-color:rgba(220,38,38,.16)}
.extcas-status-badge.is-busy{background:rgba(59,130,246,.10);color:#1d4ed8;border-color:rgba(59,130,246,.16)}
.extcas-refresh-btn{width:40px;height:40px;flex:0 0 40px;border:1px solid rgba(52,85,93,.16);border-radius:14px;background:linear-gradient(135deg,#ffffff,rgba(81,127,137,.12));color:#34555d;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 12px 28px rgba(52,85,93,.12);transition:all .18s ease;position:relative;overflow:hidden}
.extcas-refresh-btn svg{font-size:14px;line-height:1;width:18px;height:18px;display:block;flex:0 0 18px;transition:transform .18s ease,opacity .18s ease}
.extcas-refresh-btn:hover{background:linear-gradient(135deg,#ffffff,rgba(81,127,137,.18));border-color:rgba(52,85,93,.24);transform:translateY(-1px) scale(1.03)}
.extcas-refresh-btn:disabled{opacity:.9;cursor:not-allowed;transform:none}
.extcas-refresh-btn.is-busy{background:linear-gradient(135deg,rgba(59,130,246,.12),rgba(255,255,255,.96));color:#1d4ed8;border-color:rgba(59,130,246,.24);box-shadow:0 12px 28px rgba(59,130,246,.16)}
.extcas-refresh-btn.is-busy svg{animation:extcasRefreshSpin .9s linear infinite}
@keyframes extcasRefreshSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}


@media (max-width: 1400px) and (min-width: 1101px) {
    .consultation-layout-2col {
        grid-template-columns: 344px 22px 1fr;
    }
}

/* ============================================================
   SERVICII DISPONIBILE — SURSE (Interne / Externalizate)
   „Externalizat" = prestat de terț (laborator, imagistică).
   NU confunda cu „extern" = CAS/SIUI, care are propriul card.
   ============================================================ */
.svc-src-card {
    border-radius: 16px;
    border: 1px solid var(--border-soft);
}

.svc-src-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    background: linear-gradient(135deg, rgba(52, 85, 93, 0.06) 0%, rgba(81, 127, 137, 0.04) 100%);
}

.svc-src-tabs {
    display: inline-flex;
    gap: 3px;
    padding: 3px;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid var(--border-soft);
}

.svc-src-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 13px;
    border: none;
    border-radius: 9px;
    background: transparent;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--violet-cenusiu);
    cursor: pointer;
    transition: all .2s ease;
    white-space: nowrap;
}

.svc-src-tab:hover { background: rgba(81, 127, 137, 0.08); color: var(--negru); }

.svc-src-tab.active {
    background: linear-gradient(135deg, var(--albastru-verzui-moderat), var(--verde-albastrui-moderat));
    color: #fff;
    box-shadow: 0 3px 10px rgba(52, 85, 93, .22);
}

.svc-src-tab[data-src="extern"].active {
    background: linear-gradient(135deg, #8E6BB5, #6E9BA5);
    box-shadow: 0 3px 10px rgba(142, 107, 181, .26);
}

.svc-src-tab-count {
    font-size: 10.5px;
    font-weight: 800;
    padding: 1px 6px;
    border-radius: 8px;
    background: rgba(81, 127, 137, 0.12);
}
.svc-src-tab.active .svc-src-tab-count { background: rgba(255, 255, 255, 0.24); }

/* Filtru furnizor (chips) */
.svc-provider-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.svc-prov-chip {
    padding: 4px 11px;
    border-radius: 999px;
    border: 1.5px solid var(--border-soft);
    background: rgba(255, 255, 255, 0.8);
    font-family: inherit;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--violet-cenusiu);
    cursor: pointer;
    transition: all .2s ease;
}
.svc-prov-chip:hover { border-color: var(--chip, #8E6BB5); color: var(--chip, #8E6BB5); }
.svc-prov-chip.active {
    background: var(--chip, #517F89);
    border-color: var(--chip, #517F89);
    color: #fff;
}

/* Numărul de analize al furnizorului, în pastilă. Cu el, chip-ul spune și cât
   are fiecare, nu doar cine sunt — util când alegi de unde ceri. */
.svc-prov-chip-count {
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .07);
    font-size: 10px;
    font-weight: 800;
    line-height: 16px;
    vertical-align: 1px;
}
.svc-prov-chip.active .svc-prov-chip-count { background: rgba(255, 255, 255, .25); }

/* Densitate compactă pentru lista de servicii disponibile */
.svc-src-body .services-search-box { margin-bottom: 12px; }
.svc-src-body .services-search-box input { padding: 9px 14px; font-size: 13px; }

.svc-src-body .services-available-list { max-height: 340px; }
.svc-src-body .service-category-group { margin-bottom: 12px; }

.svc-src-body .category-header {
    padding: 6px 10px;
    font-size: .72rem;
    margin-bottom: 6px;
    border-radius: 0 6px 6px 0;
}

.svc-src-body .service-available-item {
    padding: 8px 12px;
    margin-bottom: 5px;
    border-radius: 9px;
    gap: 10px;
}

.svc-src-body .service-item-name { font-size: 13px; font-weight: 600; }
.svc-src-body .service-item-desc { font-size: 11px; }
.svc-src-body .service-item-price { font-size: 13px; font-weight: 700; white-space: nowrap; }

/* Grup pe furnizor */
.category-header.is-provider {
    display: flex;
    align-items: center;
    gap: 7px;
    border-left-color: var(--prov, #8E6BB5);
    color: var(--prov, #8E6BB5);
    background: color-mix(in srgb, var(--prov, #8E6BB5) 8%, var(--light-bg));
    text-transform: none;
    letter-spacing: .2px;
    font-size: .78rem;
    font-weight: 800;
}
.svc-prov-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--prov, #8E6BB5);
    flex-shrink: 0;
}
.svc-prov-n {
    margin-left: auto;
    font-size: 10.5px;
    font-weight: 800;
    padding: 1px 7px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .7);
}

.service-available-item.is-outsourced:hover {
    border-color: #8E6BB5;
    background: rgba(142, 107, 181, 0.06);
}

.svc-empty-link {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 700;
    color: #8E6BB5;
    text-decoration: none;
}
.svc-empty-link:hover { text-decoration: underline; }

/* Pill în „Servicii efectuate" */
.svc-pill-outsourced {
    background: rgba(142, 107, 181, 0.14);
    color: #7B57A6;
}
.service-added-item.is-outsourced .service-added-price { color: #7B57A6; }

/* Modal: serviciul externalizat ales */
.svc-outsourced-pick {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1.5px solid var(--border-soft);
    background: rgba(142, 107, 181, 0.05);
}
.svc-op-main { flex: 1; min-width: 0; }
.svc-op-name { display: block; font-size: 14px; font-weight: 700; color: var(--negru); }
.svc-op-meta { display: block; font-size: 11.5px; color: var(--violet-cenusiu); margin-top: 2px; }
.svc-op-badge {
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 800;
    white-space: nowrap;
}
.svc-op-prep {
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(243, 156, 18, 0.1);
    color: #B9770E;
    font-size: 12px;
    font-weight: 600;
}

@media (max-width: 640px) {
    .svc-src-header { flex-direction: column; align-items: stretch; }
    .svc-src-tabs { width: 100%; }
    .svc-src-tab { flex: 1; justify-content: center; }
}

/* ============================================================
   RESPONSIVE — corecții verificate pe ecran real (≤640px)
   ============================================================ */
@media (max-width: 640px) {
    /* Butonul flotant de scroll (50px, fixed dreapta-jos, z-index 9999) acoperea
       ultimele rânduri de conținut. Rezervăm spațiu sub conținut, nu mutăm butonul. */
    .content,
    .main-content-premium,
    .consultation-premium-container {
        padding-bottom: 84px;
    }
}

/* Lista „Servicii disponibile" pe ecrane mici: denumirea primea doar ~114px din 293
   (preț + buton + gap-uri mâncau restul) și se rupea pe 3-4 rânduri.
   Rearanjăm pe două rânduri: denumire sus pe toată lățimea, preț dedesubt,
   butonul „+" pe dreapta, centrat pe ambele rânduri. */
@media (max-width: 640px) {
    .svc-src-body .service-available-item {
        display: grid;
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "info btn"
            "price btn";
        align-items: center;
        column-gap: 10px;
        row-gap: 2px;
    }
    .svc-src-body .service-available-item .service-item-info { grid-area: info; min-width: 0; }
    .svc-src-body .service-available-item .service-item-price {
        grid-area: price;
        justify-self: start;
        font-size: 12.5px;
        /* regula de bază pune margin-left pentru varianta pe un rând;
           pe două rânduri ar indenta prețul față de denumire */
        margin-left: 0;
    }
    .svc-src-body .service-available-item .btn-add-service {
        grid-area: btn;
        align-self: center;
    }
    .svc-src-body .service-item-name { white-space: normal; }
}

/* Rândul de profil documente (scrisoare medicală, consult sumar, bilet de trimitere,
   ecografii): cele două butoane stau într-un flex fără wrap, iar pe coloane înguste
   al doilea ieșea din card. Le lăsăm să treacă pe rândul următor. */
.ml-profile-row .form-group,
.doc-profile-row .form-group {
    flex-wrap: wrap;
}
.ml-profile-row .form-group > .btn,
.doc-profile-row .form-group > .btn {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
}

/* Antetele de card (titlu + control: select, buton, badge) sunt flex fără wrap.
   Pe ecrane înguste titlul rămânea pe ~110px și se rupea pe 3 rânduri, lângă un
   select de 175px. Le lăsăm să treacă pe rânduri separate. */
@media (max-width: 640px) {
    .card-header {
        flex-wrap: wrap;
        gap: 10px;
    }
    .card-header > .card-title { flex: 1 1 100%; }
    .card-header > .form-control,
    .card-header > select { flex: 1 1 auto; min-width: 0; }
}

/* Utilitarul .d-flex e folosit pentru bare de butoane/controale. Pe ecrane mici,
   un rând care nu încape ieșea din card (ex. Setări → Servicii: 4 controale cu
   416px necesari într-un container de 337px). Wrap-ul se activează doar când
   conținutul chiar nu încape, deci nu schimbă nimic acolo unde încape. */
@media (max-width: 640px) {
    .d-flex { flex-wrap: wrap; }
}

/* ============================================================
   ȚINTE DE ATINS PE MOBIL (Cabinet medic / asistent)
   Butonul principal „Continuă consultația" avea 29px înălțime și font 11px,
   iar filtrele 24px — sub pragul confortabil de atins pe telefon/tabletă,
   exact pe ecranul folosit cel mai des în mișcare.
   Regulile de mai jos vin după blocul (max-width:480px) ca să-l suprascrie.
   ============================================================ */
@media (max-width: 640px) {
    .btn-cab-action {
        min-height: 38px;
        padding: 8px 12px;
        font-size: 12px;
    }
    .cab-mini-stat {
        min-height: 34px;
        padding: 6px 10px;
    }
}

/* Bara de acțiuni a modalelor care nu au .modal-footer (butoanele stau în
   interiorul formularului). Pe ecrane joase — landscape pe telefon, unde rămân
   ~300px pentru corpul modalului — trebuia derulat prin tot formularul ca să
   ajungi la „Trimite". O fixăm la baza zonei care derulează. */
.modal-actions-sticky {
    position: sticky;
    bottom: 0;
    z-index: 2;
    padding: 10px 0 2px;
    margin-top: 12px !important;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, var(--surface-strong, #fff) 28%);
}

/* ============================================================
   ECHILIBRAREA COLOANELOR DIN TAB-UL SERVICII
   Când modulul CAS e dezactivat, coloana stângă rămâne doar cu
   „Servicii disponibile" și era mult mai scurtă decât coloana dreaptă
   („Servicii efectuate" + totaluri). Selectorul :only-child se activează
   singur exact în acel caz — nu e nevoie de nicio clasă din PHP.
   ============================================================ */
@media (min-width: 993px) {
    .services-left-column > .services-available-card:only-child {
        flex: 1 1 auto;
        display: flex;
        min-height: 0;
    }
    .services-left-column > .services-available-card:only-child > .card {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        min-height: 0;
    }
    .services-left-column > .services-available-card:only-child > .card > .card-body {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        min-height: 0;
    }
    /* Lista crește ca să umple înălțimea, în loc să rămână la 280px fixați */
    .services-left-column > .services-available-card:only-child .services-available-list {
        flex: 1 1 auto;
        max-height: none;
    }
}


/* Filtru fara efect pe baza de perioada aleasa: se vede ca e inactiv, nu disparut.
   Ascuns cu totul, omul l-ar cauta; lasat viu, l-ar apasa degeaba. */
.rsp-field.is-muted { opacity: .55; }
.rsp-field.is-muted input { cursor: not-allowed; }

/* ============================================================
   SETĂRI → NOTIFICĂRI — organizare pe pași și carduri de canal
   ------------------------------------------------------------
   Pagina avea toate opțiunile într-o singură secțiune: bifele de canal,
   configurarea fiecărui provider, șabloanele și evenimentele, amestecate.
   Structura de aici răspunde pe rând la două întrebări — CÂND se trimite
   și PE CE CANAL — iar fiecare canal își ține configurarea în cardul lui.
   ============================================================ */

.mi-nblock { margin-bottom: 26px; }

.mi-nblock-title {
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--verde-albastrui-moderat, #517F89);
    padding-bottom: 8px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(81,127,137,.16);
}

/* ---- Cardul unui canal ---- */
.mi-nchan {
    border: 1px solid rgba(81,127,137,.18);
    border-radius: 16px;
    background: #fff;
    margin-bottom: 12px;
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.mi-nchan:hover { border-color: rgba(81,127,137,.34); }

/* Canal oprit: rămâne vizibil, dar retras vizual */
.mi-nchan.is-off { background: rgba(208,219,219,.18); }
.mi-nchan.is-off .mi-nchan-icon { opacity: .5; }

.mi-nchan-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
}

.mi-nchan-icon {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(52,85,93,.14), rgba(81,127,137,.10));
    color: var(--albastru-verzui-moderat, #34555D);
}

.mi-nchan-info { flex: 1; min-width: 0; }

.mi-nchan-title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--dark-text, #333);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.mi-nchan-hint {
    font-size: 0.82rem;
    color: var(--violet-cenusiu, #5F737A);
    margin-top: 2px;
}

.mi-nchan-pill {
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .6px;
    padding: 3px 9px;
    border-radius: 999px;
    white-space: nowrap;
}

.mi-nchan-pill.ok   { background: rgba(39,174,96,.14);  color: #1E8449; border: 1px solid rgba(39,174,96,.28); }
.mi-nchan-pill.warn { background: rgba(243,156,18,.16); color: #B9770E; border: 1px solid rgba(243,156,18,.32); }
.mi-nchan-pill.off  { background: rgba(95,115,122,.12); color: #5F737A; border: 1px solid rgba(95,115,122,.22); }

/* Comutatorul din capul cardului */
.mi-nchan-switch {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--violet-cenusiu, #5F737A);
    cursor: pointer;
    user-select: none;
    padding: 6px 10px;
    border-radius: 10px;
    border: 1px solid rgba(81,127,137,.18);
    background: rgba(255,255,255,.7);
}

.mi-nchan-switch input { cursor: pointer; }

.mi-nchan-body {
    padding: 0 16px 16px;
    border-top: 1px solid rgba(81,127,137,.12);
    padding-top: 14px;
}

/* Canal oprit: ascundem configurarea, ca să nu aglomereze pagina degeaba */
.mi-nchan.is-off .mi-nchan-body { display: none; }

@media (max-width: 576px) {
    .mi-nchan-head { flex-wrap: wrap; }
    .mi-nchan-switch { width: 100%; justify-content: center; }
}

/* ------------------------------------------------------------
   Secțiune care nu se pliază niciodată
   ------------------------------------------------------------
   .dp-section-body are `max-height:2000px` + `overflow:hidden` — mecanismul de
   pliere. Pentru secțiunile fără `dpToggleSection` pe antet, plafonul nu ajută
   la nimic și taie conținutul care trece de 2000px (exact ce pățea previzualizarea
   ultimului șablon din Notificări).
   ------------------------------------------------------------ */
.dp-section.is-static > .dp-section-body {
    max-height: none;
    overflow: visible;
}

/* ------------------------------------------------------------
   Bibliotecă de șabloane WhatsApp
   ------------------------------------------------------------ */
.wa-list { display: flex; flex-direction: column; gap: 8px; }

.wa-empty {
    padding: 16px;
    border: 1px dashed rgba(81,127,137,.3);
    border-radius: 12px;
    color: var(--violet-cenusiu, #5F737A);
    font-size: .88rem;
    text-align: center;
}

.wa-item {
    border: 1px solid rgba(81,127,137,.18);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

/* Șablonul care chiar se trimite — marcat cu bandă verde la stânga */
.wa-item.is-active {
    border-color: rgba(39,174,96,.4);
    box-shadow: inset 3px 0 0 #27AE60;
}

.wa-item-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    flex-wrap: wrap;
}

.wa-item-head input[type="radio"] { flex: 0 0 auto; width: 17px; height: 17px; cursor: pointer; }
.wa-item-name  { flex: 1 1 200px; min-width: 0; font-weight: 700; }
.wa-item-slot  { flex: 0 0 auto; width: auto; min-width: 148px; }

.wa-item-count {
    flex: 0 0 auto;
    font-size: .72rem;
    font-weight: 700;
    color: var(--violet-cenusiu, #5F737A);
    background: rgba(81,127,137,.10);
    padding: 4px 9px;
    border-radius: 999px;
    white-space: nowrap;
}

.wa-item-btn { flex: 0 0 auto; padding: 7px 12px; font-size: .8rem; }
.wa-item-del { color: #B42318; border-color: rgba(231,76,60,.28); }

/* Corpul de editare se vede doar când rândul e deschis */
.wa-item-body { display: none; padding: 0 12px 14px; border-top: 1px solid rgba(81,127,137,.12); }
.wa-item.is-open .wa-item-body { display: block; padding-top: 12px; }

.wa-pos { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.wa-pos code {
    min-width: 46px; text-align: center; padding: 4px 6px; border-radius: 8px;
    background: rgba(81,127,137,.12); font-weight: 700;
}
.wa-pos select { flex: 1; }

.wa-preview {
    padding: 10px 12px;
    border-radius: 12px;
    background: #E7FFDB;
    border: 1px solid rgba(39,174,96,.25);
    white-space: pre-wrap;
    font-size: .9rem;
    min-height: 38px;
}

@media (max-width: 576px) {
    .wa-item-name, .wa-item-slot { flex: 1 1 100%; }
}

/* .dp-form-row este grid pe 2 coloane; `flex:1 1 100%` nu are efect acolo.
   Pentru elementele care trebuie să ocupe tot rândul: */
.dp-span-2 { grid-column: 1 / -1; }
