/* Generated from resources/styles/legacy by npm run build. */

/* partials/_layout */

/* =========================================================
   VAGHTCHIN - GLASS SIDEBAR
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */



html.vaghtchin-panel {

    --sidebar-width: 275px;
    --sidebar-collapsed-width: 91px;

    --glass-bg: rgba(255, 255, 255, 0.5);
    --glass-bg-hover: rgba(255, 255, 255, .88);
    --glass-bg-active: rgba(255, 255, 255, .96);

   --glass-border: rgba(255, 255, 255, 0.5);

    --sidebar-text: #64748b;
    --sidebar-text-dark: #0f172a;

    --sidebar-radius: 20px;
      /* رنگ گرادیانت آیتم فعال (طبق عکس) */
    --active-grad-1: #5eead4;   /* تیل روشن */
    --active-grad-2: #14b8a6;   /* تیل تیره‌تر */

    /* رنگ کارت پشتیبانی در فوتر سایدبار */
    --support-accent: #11aa92;
    --support-accent-dark: #0c7a69;


}


/* =========================================================
   MOBILE HEADER
========================================================= */

.vaghtchin-panel .mobile-header {

    display: none;

}


/* =========================================================
   SIDEBAR BASE
========================================================= */

.vaghtchin-panel .side-menu {

    position: fixed;

    inset: 0;

    z-index: 50;

    pointer-events: none;

}


/* =========================================================
   SIDEBAR CONTENT
========================================================= */

.vaghtchin-panel .side-menu .side-menu__content {

    position: fixed;

    top: 12px;
    bottom: 12px;

    width: var(--sidebar-width);

    pointer-events: auto;

    display: flex;

    flex-direction: column;

    overflow: hidden;

    background: var(--glass-bg) !important;

    backdrop-filter:
        blur(28px)
        saturate(160%);

    -webkit-backdrop-filter:
        blur(28px)
        saturate(160%);

    border: 1px solid var(--glass-border);

    border-radius: var(--sidebar-radius);

   box-shadow: 0 20px 60px -25px rgba(255, 255, 255, 0.22), 0 4px 12px rgba(15, 23, 42, .04);

    transition:

        width .3s cubic-bezier(.4,0,.2,1),

        transform .35s cubic-bezier(.4,0,.2,1),

        box-shadow .3s ease;

}


/* =========================================================
   RTL
========================================================= */

html.vaghtchin-panel[dir="rtl"] .side-menu .side-menu__content {

    right: 12px;

    left: auto;

}


/* =========================================================
   LTR
========================================================= */

html.vaghtchin-panel[dir="ltr"] .side-menu .side-menu__content {

    left: 12px;

    right: auto;

}


/* =========================================================
   LOGO
========================================================= */

.vaghtchin-panel .side-menu__logo {

    position: relative;

    height: 105px;

    min-height: 105px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 16px 20px;

}


/* Logo Link */

.vaghtchin-panel .side-menu__logo-link {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}


/* Logo Image */

.vaghtchin-panel .side-menu__logo img {

    width: auto;

    height: 58px;

    max-width: 185px;

    -o-object-fit: contain;

       object-fit: contain;

    filter:
        drop-shadow(
            0 6px 14px
            rgba(15, 23, 42, .08)
        );

    transition:

        width .3s ease,

        height .3s ease,

        opacity .3s ease;

}


/* Logo Divider */

.vaghtchin-panel .side-menu__logo-line {

    position: absolute;

    bottom: 0;

    left: 24px;

    right: 24px;

    height: 1px;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(148, 163, 184, .25),
            transparent
        );

}


/* =========================================================
   SCROLL
========================================================= */

.vaghtchin-panel .side-menu__scroll {

    flex: 1;

    width: 100%;

    overflow-y: auto;

    overflow-x: hidden;

    padding: 20px 16px 10px;

}


.vaghtchin-panel .side-menu__scroll::-webkit-scrollbar {

    width: 4px;

}


.vaghtchin-panel .side-menu__scroll::-webkit-scrollbar-track {

    background: transparent;

}


.vaghtchin-panel .side-menu__scroll::-webkit-scrollbar-thumb {

    background: rgba(100, 116, 139, .15);

    border-radius: 999px;

}


.vaghtchin-panel .side-menu__scroll {

    scrollbar-width: thin;

    scrollbar-color:
        rgba(100,116,139,.15)
        transparent;

}


/* =========================================================
   LINKS
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link {

    position: relative;

    width: 100%;

    min-height: 48px;

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 0 13px;

    margin-bottom: 4px;

    border-radius: 13px;

    color: var(--sidebar-text) !important;

    text-decoration: none;

    transition:

        background .2s ease,

        color .2s ease,

        transform .2s ease,

        box-shadow .2s ease;

}


/* =========================================================
   ICON
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link__icon {

    width: 20px;

    height: 20px;

    min-width: 20px;

    stroke-width: 1.5;

    color: currentColor;

    transition:

        transform .2s ease,

        color .2s ease;

}


/* =========================================================
   TITLE
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link__title {

    flex: 1;

    font-size: 14px;

    font-weight: 450;

    white-space: nowrap;

    transition:

        opacity .2s ease,

        transform .2s ease;

}


/* =========================================================
   CHEVRON
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link__chevron {

    width: 16px;

    height: 16px;

    flex-shrink: 0;

    transition:

        transform .25s ease,

        opacity .2s ease;

}


/* =========================================================
   HOVER
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link:hover {

    color: var(--sidebar-text-dark) !important;

    background: var(--glass-bg-hover) !important;

    box-shadow:

        0 8px 24px -12px
        rgba(15, 23, 42, .20);

    transform: translateY(-1px);

}


/* Icon Hover */

.vaghtchin-panel .side-menu .side-menu__link:hover
.side-menu__link__icon {

    transform: scale(1.04);

}


/* =========================================================
   ACTIVE
========================================================= */

.vaghtchin-panel .side-menu .side-menu__link--active {

    color: #ffffff !important;

    background: linear-gradient(
        135deg,
        var(--active-grad-1),
        var(--active-grad-2)
    ) !important;

    box-shadow:

        0 10px 25px -10px
        rgba(20, 184, 166, .45),

        inset 0 0 0 1px
        rgba(255, 255, 255, .25);

}

.vaghtchin-panel .side-menu .side-menu__link--active .side-menu__link__icon {

    stroke: #ffffff;
    fill: rgba(255, 255, 255, .18);

}

.vaghtchin-panel .side-menu .side-menu__link--active .side-menu__link__title {

    color: #ffffff;
    font-weight: 500;

}

/* حذف نوار کناری تیره چون پس‌زمینه خودش کافیه */
.vaghtchin-panel .side-menu .side-menu__link--active::before {

    display: none;

}


/* =========================================================
   SUBMENU
========================================================= */

.vaghtchin-panel .side-menu__submenu {

    display: none;

    padding: 3px 0 5px;

}


.vaghtchin-panel .side-menu__submenu--open {

    display: block;

}


/* Child */

.vaghtchin-panel .side-menu__link--child {

    min-height: 43px !important;

    font-size: 13px;

}


/* Child indentation */

html.vaghtchin-panel[dir="rtl"]
.side-menu__link--child {

    padding-right: 28px !important;

}


html.vaghtchin-panel[dir="ltr"]
.side-menu__link--child {

    padding-left: 28px !important;

}


/* =========================================================
   FOOTER
========================================================= */

.vaghtchin-panel .side-menu__footer {

    padding:

        10px
        16px
        16px;

}


/* ---------------------------------------------------------
   SUPPORT CARD
--------------------------------------------------------- */

.vaghtchin-panel .side-menu__support {

    position: relative;

    display: flex;

    flex-direction: column;

    gap: 8px;

    padding: 10px;

    overflow: hidden;

    border-radius: 16px;

    background:white;

    border: 1px solid rgba(255, 255, 255, .75);


    transition:

        padding .3s cubic-bezier(.4,0,.2,1),

        box-shadow .3s ease;

}







/* Logo Tile */

.vaghtchin-panel .side-menu__support-logo {

    box-sizing: border-box;

    width: 34px;

    height: 34px;

    min-width: 34px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 5px;

    border-radius: 11px;

    background: rgba(255, 255, 255, .94);

  

}


.vaghtchin-panel .side-menu__support-logo img {

    width: 100%;

    height: 100%;

    display: block;

    -o-object-fit: contain;

       object-fit: contain;

}





/* Info */

.vaghtchin-panel .side-menu__support-info {

    display: flex;

    flex-direction: column;

    gap: 1px;

    min-width: 0;

    overflow: hidden;

    transition:

        opacity .25s ease,

        max-width .3s cubic-bezier(.4,0,.2,1);

}


.vaghtchin-panel .side-menu__support-title {

    font-size: 12.5px;

    font-weight: 600;

    line-height: 1.35;

    white-space: nowrap;

    color: var(--sidebar-text-dark);

}


.vaghtchin-panel .side-menu__support-caption {

    font-size: 10.5px;

    font-weight: 400;

    line-height: 1.35;

    white-space: nowrap;

    color: rgba(100, 116, 139, .90);

}


/* Divider */

.vaghtchin-panel .side-menu__support-line {

    height: 1px;

    flex-shrink: 0;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(148, 163, 184, .35),
            transparent
        );

}


/* ---------------------------------------------------------
   PHONE NUMBERS
--------------------------------------------------------- */

.vaghtchin-panel .side-menu__support-numbers {

    position: relative;

    z-index: 1;

    display: flex;

    flex-direction: column;

    gap: 4px;

}


.vaghtchin-panel .side-menu .side-menu__phone {

    display: flex;

    align-items: center;

    gap: 9px;

    min-height: 34px;

    padding: 0 6px;

    border-radius: 11px;

    color: var(--sidebar-text) !important;

    text-decoration: none;

    transition:

        background .2s ease,

        color .2s ease,

        gap .3s cubic-bezier(.4,0,.2,1),

        padding .3s cubic-bezier(.4,0,.2,1);

}


.vaghtchin-panel .side-menu .side-menu__phone:hover {

    color: var(--sidebar-text-dark) !important;

    background: rgba(255, 255, 255, .88);

}


/* Phone Icon */

.vaghtchin-panel .side-menu .side-menu__phone-icon {

    box-sizing: border-box;

    width: 28px;

    height: 28px;

    min-width: 28px;

    padding: 6px;

    border-radius: 9px;

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

    stroke: currentColor;

    fill: none;

    stroke-width: 1.8;

    background: rgba(17, 170, 146, .13);

    transition:

        background .2s ease,

        box-shadow .2s ease,

        transform .2s ease,

        color .2s ease;

}


.vaghtchin-panel .side-menu .side-menu__phone:hover
.side-menu__phone-icon {

    color: #ffffff;

    transform: scale(1.06);

    background: linear-gradient(
        135deg,
        var(--support-accent),
        var(--support-accent-dark)
    );

    box-shadow:

        0 8px 18px -8px
        rgba(17, 170, 146, .75);

}


/* Phone Number */

.vaghtchin-panel .side-menu .side-menu__phone-number {

    flex: 1;

    min-width: 0;

    font-size: 13px;

    font-weight: 500;

    letter-spacing: .2px;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    transition:

        opacity .25s ease,

        max-width .3s cubic-bezier(.4,0,.2,1);

}


/* =========================================================
   CLOSE BUTTON
========================================================= */

.vaghtchin-panel .close-mobile-menu {

    display: none;

}


/* =========================================================
   DESKTOP
========================================================= */

@media (min-width: 1280px) {


    /* Sidebar active */

    .vaghtchin-panel .side-menu {

        pointer-events: none;

    }


    /* Always visible */

    .vaghtchin-panel .side-menu .side-menu__content {

        transform: none !important;

    }


    /* Collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__content {

        width: var(--sidebar-collapsed-width);

    }


    /* Expanded */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__content {

        width: var(--sidebar-width);

        box-shadow:

            0 25px 70px -25px
            rgba(15, 23, 42, .28);

    }


    /* Logo collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__logo img {

        width: 42px;

        height: 42px;

    }


    /* Logo expanded on hover */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__logo img {

        width: auto;

        height: 58px;

        max-width: 185px;

    }


    /* Text collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__link__title {

        opacity: 0;

        pointer-events: none;

    }


    /* Text hover */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__link__title {

        opacity: 1;

        pointer-events: auto;

    }


    /* Chevron collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__link__chevron {

        opacity: 0;

        width: 0;

        overflow: hidden;

    }


    /* Chevron hover */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__link__chevron {

        opacity: 1;

        width: 16px;

    }


    /* Center icons collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__link {

        justify-content: center;

        gap: 0;

    }


    /* Normal links on hover */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__link {

        justify-content: flex-start;

        gap: 12px;

    }


    /* Footer */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__footer {

        padding-left: 12px;

        padding-right: 12px;

    }


    /* Support card collapsed */

    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__support {

        padding: 8px 6px;

        gap: 6px;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__support-head {

        justify-content: center;

        gap: 0;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__support-info {

        max-width: 0;

        opacity: 0;

        pointer-events: none;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__phone {

        justify-content: center;

        gap: 0;

        padding: 0;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed
    .side-menu__phone-number {

        flex: none;

        max-width: 0;

        opacity: 0;

        pointer-events: none;

    }


    /* Support card expanded on hover */

    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__support {

        padding: 10px;

        gap: 8px;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__support-head {

        justify-content: flex-start;

        gap: 10px;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__support-info {

        max-width: 180px;

        opacity: 1;

        pointer-events: auto;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__phone {

        justify-content: flex-start;

        gap: 9px;

        padding: 0 6px;

    }


    .vaghtchin-panel .side-menu.side-menu--collapsed.side-menu--on-hover
    .side-menu__phone-number {

        flex: 1;

        max-width: 180px;

        opacity: 1;

        pointer-events: auto;

    }


    /* Mobile stuff hidden */

    .vaghtchin-panel .mobile-header,

    .vaghtchin-panel .close-mobile-menu {

        display: none !important;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 1279px) {


    /* -----------------------------------------
       HEADER
    ----------------------------------------- */

    .vaghtchin-panel .mobile-header {

        position: fixed;

        top: 0;

        right: 0;

        left: 0;

        z-index: 45;

        height: 64px;

        display: flex;

        align-items: center;

        justify-content: space-between;

        padding:

            0
            16px;

        background:

            rgba(255,255,255,.76);

        backdrop-filter:

            blur(24px)
            saturate(160%);

        -webkit-backdrop-filter:

            blur(24px)
            saturate(160%);

        border-bottom:

            1px solid
            rgba(255,255,255,.75);

        box-shadow:

            0 8px 30px -15px
            rgba(15,23,42,.18);

    }


    /* Mobile Logo */

    .vaghtchin-panel .mobile-header__logo {

        display: flex;

        align-items: center;

        height: 100%;

    }


    .vaghtchin-panel .mobile-header__logo img {

        width: auto;

        height: 38px;

        max-width: 145px;

        -o-object-fit: contain;

           object-fit: contain;

    }


    /* Menu Button */

    .vaghtchin-panel .mobile-header__menu-button {

        width: 42px;

        height: 42px;

        display: flex;

        align-items: center;

        justify-content: center;

        border-radius: 13px;

        border:

            1px solid
            rgba(255,255,255,.85);

        background:

            rgba(255,255,255,.72);

        color: #475569;

        box-shadow:

            0 5px 15px -8px
            rgba(15,23,42,.25);

        cursor: pointer;

        transition:

            background .2s ease,

            transform .2s ease,

            color .2s ease;

    }


    .vaghtchin-panel .mobile-header__menu-button:hover {

        background: #fff;

        color: #0f172a;

    }


    .vaghtchin-panel .mobile-header__menu-button:active {

        transform: scale(.94);

    }


    /* -----------------------------------------
       SIDEBAR
    ----------------------------------------- */

    .vaghtchin-panel .side-menu {

        pointer-events: none;

    }


    .vaghtchin-panel .side-menu .side-menu__content {

        top: 0 !important;

        bottom: 0 !important;

        width: 285px !important;

        height: 100vh !important;

        margin: 0 !important;

        border-radius:0 !important;

        background:

            rgba(255,255,255,.88) !important;

        backdrop-filter:

            blur(30px)
            saturate(160%);

        -webkit-backdrop-filter:

            blur(30px)
            saturate(160%);

        transform: translateX(110%) !important;

        transition:

            transform
            .35s
            cubic-bezier(.4,0,.2,1),

            box-shadow
            .35s ease;

        z-index: 55;

    }


    /* RTL sidebar */

    html.vaghtchin-panel[dir="rtl"]
    .side-menu .side-menu__content {

        right: 0 !important;

        left: auto !important;

    }


    /* LTR sidebar */

    html.vaghtchin-panel[dir="ltr"]
    .side-menu .side-menu__content {

        left: 0 !important;

        right: auto !important;

        transform:
            translateX(-110%) !important;

    }


    /* OPEN */

    .vaghtchin-panel .side-menu.side-menu--mobile-menu-open {

        pointer-events: auto;

    }


    .vaghtchin-panel .side-menu.side-menu--mobile-menu-open
    .side-menu__content {

        transform: translateX(0) !important;

        box-shadow:

            20px 0 70px -25px
            rgba(15,23,42,.30);

    }


    /* -----------------------------------------
       OVERLAY
    ----------------------------------------- */

    .vaghtchin-panel .side-menu::before {

        content: "";

        position: fixed;

        inset: 0;

        z-index: 50;

        background:

            rgba(15,23,42,.28);

        backdrop-filter:

            blur(3px);

        -webkit-backdrop-filter:

            blur(3px);

        opacity: 0;

        visibility: hidden;

        transition:

            opacity .3s ease,

            visibility .3s ease;

    }


    .vaghtchin-panel .side-menu.side-menu--mobile-menu-open::before {

        opacity: 1;

        visibility: visible;

    }


    /* -----------------------------------------
       LOGO
    ----------------------------------------- */

    .vaghtchin-panel .side-menu__logo {

        height: 100px;

        min-height: 100px;

    }


    .vaghtchin-panel .side-menu__logo img {

        height: 54px !important;

        width: auto !important;

        max-width: 180px !important;

        opacity: 1 !important;

    }


    /* -----------------------------------------
       MENU
    ----------------------------------------- */

    .vaghtchin-panel .side-menu__scroll {

        padding:

            16px
            16px
            10px;

    }


    /* -----------------------------------------
       TEXT
    ----------------------------------------- */

    .vaghtchin-panel .side-menu .side-menu__link__title {

        opacity: 1 !important;

        pointer-events: auto !important;

    }


    /* -----------------------------------------
       ICON
    ----------------------------------------- */

    .vaghtchin-panel .side-menu .side-menu__link {

        justify-content: flex-start !important;

        gap: 12px !important;

    }


    /* -----------------------------------------
       CHEVRON
    ----------------------------------------- */

    .vaghtchin-panel .side-menu .side-menu__link__chevron {

        display: block !important;

        opacity: 1 !important;

        width: 16px !important;

    }


    /* -----------------------------------------
       CLOSE
    ----------------------------------------- */

    .vaghtchin-panel .close-mobile-menu {

        position: fixed;

        top: 16px;

        z-index: 60;

        width: 42px;

        height: 42px;

        display: none;

        align-items: center;

        justify-content: center;

    }


    html.vaghtchin-panel[dir="rtl"]
    .close-mobile-menu {

        right: 300px;

    }


    html.vaghtchin-panel[dir="ltr"]
    .close-mobile-menu {

        left: 285px;

    }


    .vaghtchin-panel .close-mobile-menu button {

        width: 42px;

        height: 42px;

        display: flex;

        align-items: center;

        justify-content: center;

        border: 1px solid
            rgba(255,255,255,.8);

        border-radius: 999px;

        background:
            rgba(255,255,255,.85);

        color: #334155;

        box-shadow:

            0 8px 25px -10px
            rgba(15,23,42,.30);

        cursor: pointer;

        transition:

            transform .2s ease,

            background .2s ease;

    }


    .vaghtchin-panel .close-mobile-menu button:hover {

        background: #fff;

        transform: rotate(90deg);

    }


    .vaghtchin-panel .side-menu.side-menu--mobile-menu-open
    .close-mobile-menu {

        display: flex;

    }


    /* -----------------------------------------
       FOOTER
    ----------------------------------------- */

    .vaghtchin-panel .side-menu__footer {

        padding:

            10px
            16px
            16px;

    }

}


/* =========================================================
   RTL MOBILE CLOSE POSITION
========================================================= */

@media (max-width: 1279px) {

    html.vaghtchin-panel[dir="rtl"]
    .side-menu.side-menu--mobile-menu-open
    .close-mobile-menu {

        display: flex;

    }

}


/* =========================================================
   BODY WHEN MOBILE MENU OPEN
========================================================= */

.vaghtchin-panel body.sidebar-mobile-open {

    overflow: hidden !important;

}


/* visit-form */



/* گروه‌های سطح ۱ همیشه باز */
.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-content {
    display: block !important;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header .group-arrow {
    transform: rotate(180deg) !important;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header {
    cursor: default;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header:hover {
    background: #f8fafc;
}

/* گروه‌های سطح ۲ و بیشتر - قابلیت بسته و باز شدن */
.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-content,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-content {
    display: none; /* پیش‌فرض بسته */
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header {
    cursor: pointer;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header .group-arrow,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header .group-arrow {
    transform: rotate(0deg) !important; /* پیش‌فرض بسته */
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header.active .group-arrow,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header.active .group-arrow {
    transform: rotate(180deg) !important; /* وقتی باز است */
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-content.show,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-content.show {
    display: block !important; /* وقتی باز است */
}

.vaghtchin-surface-visit-form #refresh_stats_btn {
	display: none;
}
/* ===================================================== */
/* گروه‌های تو در تو - استایل مخصوص */
/* ===================================================== */
.vaghtchin-surface-visit-form .nested-group-wrapper {
    display: block !important;
    width: 100% !important;
}

/* اطمینان از اینکه گروه‌های تو در تو در دو ستون نمایش داده شوند */
.vaghtchin-surface-visit-form .nested-group-wrapper .group-accordion {
    display: block !important;
    width: 100% !important;
    margin-bottom: 0 !important;
}

/* وقتی یک گروه تو در تو داخل یک آیتم دو ستونه قرار می‌گیرد */
.vaghtchin-surface-visit-form .masonry-item.span-2 .nested-group-wrapper .group-content .grid-masonry {
  
    -moz-column-gap: 12px !important;
  
         column-gap: 12px !important;
}

/* برای گروه‌های تو در تو که در سطح ۲ هستند */
.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] .group-content .grid-masonry {
    -moz-column-gap: 10px !important;
         column-gap: 10px !important;
}

/* برای گروه‌های تو در تو که در سطح ۳ هستند */
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] .group-content .grid-masonry {
    -moz-column-count: 2 !important;
         column-count: 2 !important;
    -moz-column-gap: 8px !important;
         column-gap: 8px !important;
}

/* ===================================================== */
/* اصلاح برای نمایش بهتر گروه‌های تو در تو */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-accordion .group-content .grid-masonry .masonry-item.span-2 {
    -moz-column-span: all !important;
         column-span: all !important;
    width: 100% !important;
    display: block !important;
}

.vaghtchin-surface-visit-form /

@media (max-width: 1024px) {
    
}

@media (max-width: 640px) {
    .vaghtchin-surface-visit-form .masonry-item.span-2 .group-accordion .group-content .grid-masonry {
        -moz-column-count: 1 !important;
             column-count: 1 !important;
    }
}


/* ===================================================== */
/* چیدمان ستونی مستقل - Multi-Column */
/* ===================================================== */
.vaghtchin-surface-visit-form #form_fields_container {
    -moz-column-count: 3 !important;
         column-count: 3 !important;
    -moz-column-gap: 16px !important;
         column-gap: 16px !important;
    width: 100% !important;
    direction: ltr !important;
    text-align: left !important;
}

.vaghtchin-surface-visit-form #form_fields_container > * {
    -moz-column-break-inside: avoid !important;
         break-inside: avoid !important;
    margin-bottom: 16px !important;
    display: inline-block !important;
    width: 100% !important;
    direction: ltr !important;
    text-align: left !important;
}

/* ===================================================== */
/* گروه‌های تو در تو - ۲ ستون مستقل */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-content .grid-masonry {
    -moz-column-gap: 12px !important;
         column-gap: 12px !important;
    width: 100% !important;
    padding: 16px !important;
}

.vaghtchin-surface-visit-form .group-content .grid-masonry > * {
    -moz-column-break-inside: avoid !important;
         break-inside: avoid !important;
    margin-bottom: 12px !important;
    display: inline-block !important;
    width: 100% !important;
}

/* ===================================================== */
/* آیتم‌های تمام عرض (span) */
/* ===================================================== */
.vaghtchin-surface-visit-form .span-2,
.vaghtchin-surface-visit-form .span-3 {
    -moz-column-span: all !important;
         column-span: all !important;
    width: 100% !important;
}

/* ===================================================== */
/* استایل کلی گروه‌ها - مینیمال */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-accordion {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    transition: all 0.2s ease;
    display: block !important;
    width: 100% !important;
}

/*.group-accordion:hover {*/
/*    border-color: #cbd5e1;*/
/*    box-shadow: 0 2px 8px rgba(0,0,0,0.04);*/
/*}*/

/* هدر گروه */
.vaghtchin-surface-visit-form .group-header {
    padding: 12px 16px;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    transition: background 0.2s ease;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 48px;
}

.vaghtchin-surface-visit-form .group-header:hover {
    background: #f1f5f9;
}

.vaghtchin-surface-visit-form .group-header.active {
    background: #f1f5f9;
}

.vaghtchin-surface-visit-form .group-header .group-title {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.vaghtchin-surface-visit-form .group-header .group-title .group-badge {
    font-size: 11px;
    font-weight: 400;
    color: #64748b;
    background: #e2e8f0;
    padding: 1px 10px;
    border-radius: 12px;
}

.vaghtchin-surface-visit-form .group-header .group-arrow {
    transition: transform 0.25s ease;
    color: #94a3b8;
    flex-shrink: 0;
}

.vaghtchin-surface-visit-form .group-header .group-arrow svg {
    width: 18px;
    height: 18px;
}

/* محتوای گروه */
.vaghtchin-surface-visit-form .group-content {
    display: none;
    background: #ffffff;
}

.vaghtchin-surface-visit-form .group-content.show {
    display: block;
    animation: fadeSlideDown 0.25s ease;
}

/* ===================================================== */
/* گروه‌های سطح ۱ همیشه باز */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-content {
    display: block !important;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header .group-arrow {
    transform: rotate(180deg) !important;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header {
    cursor: default;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="1"] > .group-header:hover {
    background: #f8fafc;
}

/* ===================================================== */
/* گروه‌های تو در تو (سطح ۲ و پایین‌تر) */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-content,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-content {
    display: none;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header {
    cursor: pointer;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header .group-arrow,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header .group-arrow {
    transform: rotate(0deg) !important;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header.active .group-arrow,
.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header.active .group-arrow {
    transform: rotate(180deg) !important;
}

/* ===================================================== */
/* گروه‌های تو در تو - عمق‌های مختلف */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] {
    border-color: #e2e8f0;
    background: #fafbfc;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header {
    background: #f1f4f9;
    padding: 10px 14px;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header:hover {
    background: #e9edf3;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="2"] > .group-header.active {
    background: #e9edf3;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] {
    border-color: #e8ecf1;
    background: #f8f9fa;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header {
    background: #edf0f5;
    padding: 8px 12px;
}

.vaghtchin-surface-visit-form .group-accordion[data-depth="3"] > .group-header .group-title {
    font-size: 13px;
}

/* ===================================================== */
/* استایل فیلدها - مینیمال */
/* ===================================================== */
.vaghtchin-surface-visit-form .form-field {
    padding: 0;
    margin-bottom: 0;
    width: 100% !important;
}

.vaghtchin-surface-visit-form .form-field label {
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    margin-bottom: 4px;
    display: block;
}

.vaghtchin-surface-visit-form .form-field label .text-red-500 {
    font-size: 12px;
    font-weight: 400;
}

.vaghtchin-surface-visit-form .form-field input:not([type="checkbox"]):not([type="radio"]),.vaghtchin-surface-visit-form .form-field select,.vaghtchin-surface-visit-form .form-field textarea {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.2s ease;
    background: #ffffff;
    color: #1e293b;
    font-family: inherit;
    box-sizing: border-box;
}

.vaghtchin-surface-visit-form .form-field input:not([type="checkbox"]):not([type="radio"]):focus,
.vaghtchin-surface-visit-form .form-field select:focus,
.vaghtchin-surface-visit-form .form-field textarea:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.vaghtchin-surface-visit-form .form-field textarea {
    resize: vertical;
    min-height: 60px;
}

/* چک‌باکس و رادیو */
.vaghtchin-surface-visit-form .form-field input[type="checkbox"],
.vaghtchin-surface-visit-form .form-field input[type="radio"] {
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0;
    flex-shrink: 0;
}

.vaghtchin-surface-visit-form .form-field .space-y-2 {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.vaghtchin-surface-visit-form .form-field .space-y-2 label {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s ease;
    font-weight: 400;
    font-size: 14px;
    margin-bottom: 0;
}

.vaghtchin-surface-visit-form .form-field .space-y-2 label:hover {
    background: #f8fafc;
}

/* ===================================================== */
/* واکنش‌گرایی */
/* ===================================================== */
@media (max-width: 1024px) {
    .vaghtchin-surface-visit-form #form_fields_container {
        -moz-column-count: 2 !important;
             column-count: 2 !important;
        -moz-column-gap: 12px !important;
             column-gap: 12px !important;
    }
    
    .vaghtchin-surface-visit-form .group-content .grid-masonry {
        -moz-column-gap: 10px !important;
             column-gap: 10px !important;
    }
}

@media (max-width: 640px) {
    .vaghtchin-surface-visit-form #form_fields_container {
        -moz-column-count: 1 !important;
             column-count: 1 !important;
        -moz-column-gap: 10px !important;
             column-gap: 10px !important;
    }
    
    .vaghtchin-surface-visit-form .group-content .grid-masonry {
        -moz-column-count: 1 !important;
             column-count: 1 !important;
        -moz-column-gap: 8px !important;
             column-gap: 8px !important;
        padding: 12px !important;
    }
    
    .vaghtchin-surface-visit-form .group-header {
        padding: 10px 12px;
        min-height: 42px;
    }
    
    .vaghtchin-surface-visit-form .group-header .group-title {
        font-size: 13px;
    }
}

/* ===================================================== */
/* انیمیشن‌ها */
/* ===================================================== */
@keyframes fadeSlideDown {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================================== */
/* حذف آیکون پوشه */
/* ===================================================== */
.vaghtchin-surface-visit-form .group-icon {
    display: none !important;
}

/* ===================================================== */
/* چپ‌چین کردن همه المان‌های داخل فرم */
/* ===================================================== */
.vaghtchin-surface-visit-form #form_fields_container,
.vaghtchin-surface-visit-form #form_fields_container *,
.vaghtchin-surface-visit-form .group-content .grid-masonry,
.vaghtchin-surface-visit-form .group-content .grid-masonry * {
    direction: ltr !important;
    text-align: left !important;
}



/* patient-assessment */

    .vaghtchin-surface-patient-assessment .patient{
        margin-bottom: 94px;
        margin-top: 3.4rem;
    }


/* edit-booking */

    /* استایل‌های قبلی保持不变 */
    .vaghtchin-surface-edit-booking .tabs-container {
        border-bottom: 1px solid #e2e8f0;
        margin-bottom: 1.5rem;
    }
    .vaghtchin-surface-edit-booking .tabs {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
    }
    .vaghtchin-surface-edit-booking .tab-btn {
        padding: 0.75rem 1.5rem;
        font-weight: 500;
        color: #64748b;
        border-bottom: 2px solid transparent;
        cursor: pointer;
        transition: all 0.2s;
        background: none;
        border: none;
    }
    .vaghtchin-surface-edit-booking .tab-btn.active {
        color: #3b82f6;
        border-bottom-color: #3b82f6;
    }
    .vaghtchin-surface-edit-booking .tab-content {
        display: none;
    }
    .vaghtchin-surface-edit-booking .tab-content.active {
        display: block;
    }
    
    .vaghtchin-surface-edit-booking .status-approved {
        color: #166534;
        background-color: #53d56c2b;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-edit-booking .status-pending {
        color: #b45309;
        background-color: #fd9b782b;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-edit-booking .status-canceled {
        color: #b91c1c;
        background-color: #fb3e6e2b;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-edit-booking .status-rejected {
        color: #4b5563;
        background-color: #8f9ca72b;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    
    /* استایل توست در assets/css/bkap-components.css است */
    .vaghtchin-surface-edit-booking .text-danger { color: #f56565 !important; }
    .vaghtchin-surface-edit-booking .text-warning { color: #f59e0b !important; }
    .vaghtchin-surface-edit-booking .text-success { color: #48bb78 !important; }
    .vaghtchin-surface-edit-booking .text-info { color: #4299e1 !important; }
    
    .vaghtchin-surface-edit-booking .extra-row {
        display: flex;
        padding: 10px;
        border-bottom: 1px solid #e2e8f0;
    }
    .vaghtchin-surface-edit-booking .extra-row:last-child {
        border-bottom: none;
    }
    .vaghtchin-surface-edit-booking .extra-info {
        flex: 2;
    }
    .vaghtchin-surface-edit-booking .extra-name {
        font-weight: 500;
    }
    .vaghtchin-surface-edit-booking .extra-price {
        font-size: 0.875rem;
        color: #64748b;
    }
    .vaghtchin-surface-edit-booking .extra-quantity {
        width: 80px;
        padding: 5px;
        border: 1px solid #cbd5e1;
        border-radius: 0.375rem;
        text-align: center;
    }
    
    .vaghtchin-surface-edit-booking .btn-loading {
        opacity: 0.7;
        cursor: not-allowed;
    }
    .vaghtchin-surface-edit-booking .btn-loading .btn-text {
        display: none;
    }
    .vaghtchin-surface-edit-booking .btn-loading .loading-spinner {
        display: inline-block;
    }
    .vaghtchin-surface-edit-booking .loading-spinner {
        display: none;
        width: 20px;
        height: 20px;
        border: 2px solid #fff;
        border-top-color: transparent;
        border-radius: 50%;
        animation: spin 0.8s linear infinite;
    }
    @keyframes spin {
        to { transform: rotate(360deg); }
    }


/* statistic-boxes */


.vaghtchin-surface-statistic-boxes .statistic-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem 1.5rem;
    margin: 0;
    padding-top: 14px!important;
    gap: 8px !important;
}
.vaghtchin-surface-statistic-boxes #date_buttons {
	margin: 30px 40px;
	display: flex;
	gap: 16px;
	align-items: center;
}

.vaghtchin-surface-statistic-boxes #date_buttons {
    margin: 24px 0!important;
}

.vaghtchin-surface-statistic-boxes .box-number-div {
    padding: 1.25rem!important;
    font-size: 1.25rem!important;
}

.vaghtchin-surface-statistic-boxes .date_buttons_span {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.vaghtchin-surface-statistic-boxes .date_button {
    padding: 6px 14px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.3s ease;
    color: #374151;
}

.vaghtchin-surface-statistic-boxes .date_button:hover {
    background: #f3f4f6;
}

.vaghtchin-surface-statistic-boxes .date_button.active_btn {
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item {
    position: relative;
    flex: 1;
    min-width: 120px;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item i {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item i img {
    width: 16px;
    height: 16px;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item input {
    width: 100%;
    padding: 8px 35px 8px 12px;
    border: 1px solid rgb(226 232 240 / 1);
    border-radius: 8px;
    font-size: 13px;
    background: #fff!important;
    cursor: pointer;
    height: 56px;
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item input:focus {
    border-color: #2563eb;
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-separator {
    color: #6b7280;
    font-weight: bold;
    font-size: 14px;
    padding: 0 5px;
}

@media (min-width: 768px) {
    .vaghtchin-surface-statistic-boxes .statistic-grid {
        grid-template-columns: repeat(12, 1fr);
    }
    
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper {
        float: right;
        margin-top: 0;
    }
    
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item {
        min-width: 150px;
    }
}






@media (max-width: 767px) {
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper {
        flex-direction: column;
        width: 100%;
    }
    
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-item {
        width: 100%;
    }
    
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper .date-separator {
        display: none;
    }
}

.vaghtchin-surface-statistic-boxes .error-message {
    color: #dc2626;
    background: #fee2e2;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    margin-top: 10px;
    display: none;
}

.vaghtchin-surface-statistic-boxes .error-message.show {
    display: block;
}

.vaghtchin-surface-statistic-boxes .dashboard-card {
    border-radius: .6rem!important;
}



.vaghtchin-surface-statistic-boxes .appointment-status {
    display: flex;
    align-items: center;
    gap: 12px;
}

.vaghtchin-surface-statistic-boxes .appointment-status-icon {
    border-radius: 8px;
    width: 28px;
    height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.vaghtchin-surface-statistic-boxes .appointment-status-title {
    font-size: 14px;
    color: #475569;
}

.vaghtchin-surface-statistic-boxes .appointment-stats {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
}
.vaghtchin-surface-statistic-boxes .grid.grid-cols-12.gap-x-6.gap-y-10.mt-3\.5.relative {
	align-items: flex-end;
}
.vaghtchin-surface-statistic-boxes .dashboard-card.box.box--stacked.p-5 {
	padding: 10px;
}

.vaghtchin-surface-statistic-boxes #date_buttons .date_button:first-child {
	
	border-radius: 8px!important;
}
.vaghtchin-surface-statistic-boxes .grid.grid-cols-12.gap-x-6.gap-y-10.mt-34 {
	margin-top: 64px;
}

/* استایل برای موبایل */
@media (max-width: 640px) {
    /* تغییر ul به گرید دوستونه */
    .vaghtchin-surface-statistic-boxes #date_buttons ul[role="tablist"] {
        display: flex !important;
        overflow-x: auto;
        justify-content: flex-start;
        gap: 4px !important;
        padding: 4px !important;
        border-radius: 0.6rem !important;
        background: white !important;
    
        flex-wrap: nowrap !important;
    }

    /* استایل هر آیتم تب */
    .vaghtchin-surface-statistic-boxes #date_buttons ul[role="tablist"] li {
        flex: 0 0 auto !important;
        min-width: 80px !important;
        background: #f8fafc !important;
        border-radius: 0.4rem !important;
        margin: 0 !important;
        /* همه آیتم‌ها در گرید دوستونه */
        grid-column: auto !important;
        width: auto !important;
        max-width: 100% !important;
    }

    /* حذف border-radius های قبلی */
    .vaghtchin-surface-statistic-boxes #date_buttons ul[role="tablist"] li:first-child,
    .vaghtchin-surface-statistic-boxes #date_buttons ul[role="tablist"] li:last-child {
        border-radius: 0.4rem !important;
    }

    /* استایل دکمه‌ها */
    .vaghtchin-surface-statistic-boxes #date_buttons ul[role="tablist"] li button {
        padding: 8px 4px !important;
        font-size: 13px !important;
        border-radius: 0.4rem !important;
        width: 100% !important;
        text-align: center !important;
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* فضای بین بخش تب‌ها و تاریخ سفارشی */
    .vaghtchin-surface-statistic-boxes .custom-date-range-wrapper {
        margin-top: 12px !important;
        flex-direction: column !important;
        gap: 8px !important;
        align-items: stretch !important;
    }

    /* استایل تاریخ سفارشی در موبایل */
    .vaghtchin-surface-statistic-boxes .date-item {
        width: 100% !important;
        margin: 0 !important;
    }

    .vaghtchin-surface-statistic-boxes .date-separator {
        text-align: center !important;
        padding: 2px 0 !important;
    }

    /* دکمه فعال */
    .vaghtchin-surface-statistic-boxes .active_btn {
        background: #3b82f6 !important;
        color: white !important;
        border-color: #3b82f6 !important;
    }
    .vaghtchin-surface-statistic-boxes ul.p-0\.5.border.dark\:border-darkmode-400.flex.flex-wrap.justify-center.w-full.rounded-\[0\.6rem\].border-slate-200.bg-white.shadow-sm {
    width: 100%!important;
}
}

.vaghtchin-surface-statistic-boxes .dashboard-card-body {
	padding: 0!important;
}
.vaghtchin-surface-statistic-boxes #statistic-boxes-area {
	border-top: none !important;
	border-bottom: none !important;
	padding: 0 !important;
	margin: 0 !important;
}


.vaghtchin-surface-statistic-boxes ul.p-0\.5.border.dark\:border-darkmode-400.flex.flex-wrap.justify-center.w-full.rounded-\[0\.6rem\].border-slate-200.bg-white.shadow-sm {
    width: 80%;
}



/* revenue-chart */

/* فونت‌ها */
.vaghtchin-surface-revenue-chart #revenueChart,
.vaghtchin-surface-revenue-chart .apexcharts-text,
.vaghtchin-surface-revenue-chart .apexcharts-title-text,
.vaghtchin-surface-revenue-chart .apexcharts-xaxis-label,
.vaghtchin-surface-revenue-chart .apexcharts-yaxis-label,
.vaghtchin-surface-revenue-chart .apexcharts-legend-text,
.vaghtchin-surface-revenue-chart .apexcharts-tooltip,
.vaghtchin-surface-revenue-chart .apexcharts-tooltip-title,
.vaghtchin-surface-revenue-chart .apexcharts-tooltip-text,
.vaghtchin-surface-revenue-chart .apexcharts-datalabel,
.vaghtchin-surface-revenue-chart .apexcharts-datalabel-label,
.vaghtchin-surface-revenue-chart .apexcharts-datalabel-value {
    font-family: 'YekanBakhFaNum', sans-serif !important;
}
.vaghtchin-surface-revenue-chart #filterSlideoverRevenue {
    z-index: 999;
}
.vaghtchin-surface-revenue-chart .apexcharts-toolbar {
	display: none;
}

/* ریسپانسیو */
@media (max-width: 768px) {
    .vaghtchin-surface-revenue-chart .revenue-chart-wrapper {
        overflow-x: visible;
        overflow-y: visible;
    }
    .vaghtchin-surface-revenue-chart #revenueChart {
        min-width: 0;
        width: 100%;
    }
}
@media (max-width: 640px) {
    .vaghtchin-surface-revenue-chart .revenue-chart-wrapper {
        min-height: 280px;
    }
    .vaghtchin-surface-revenue-chart #revenueChart {
        min-width: 0;
    }
}
.vaghtchin-surface-revenue-chart .revenue-chart-wrapper::-webkit-scrollbar {
    height: 5px;
}
.vaghtchin-surface-revenue-chart .revenue-chart-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}
.vaghtchin-surface-revenue-chart .revenue-chart-wrapper::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 10px;
}
.vaghtchin-surface-revenue-chart .revenue-chart-wrapper::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* دیت‌پیکر */
.vaghtchin-surface-revenue-chart .mds-persian-datetime-picker {
    z-index: 9999 !important;
}


/* chart */

/* فونت‌ها */
.vaghtchin-surface-chart #appointmentsChart,
.vaghtchin-surface-chart .apexcharts-text,
.vaghtchin-surface-chart .apexcharts-title-text,
.vaghtchin-surface-chart .apexcharts-xaxis-label,
.vaghtchin-surface-chart .apexcharts-yaxis-label,
.vaghtchin-surface-chart .apexcharts-legend-text,
.vaghtchin-surface-chart .apexcharts-tooltip,
.vaghtchin-surface-chart .apexcharts-tooltip-title,
.vaghtchin-surface-chart .apexcharts-tooltip-text,
.vaghtchin-surface-chart .apexcharts-datalabel,
.vaghtchin-surface-chart .apexcharts-datalabel-label,
.vaghtchin-surface-chart .apexcharts-datalabel-value {
    font-family: 'YekanBakhFaNum', sans-serif !important;
}

.vaghtchin-surface-chart #filterSlideover {
    z-index: 999;
}

/* ریسپانسیو - بدون اسکرول افقی */
.vaghtchin-surface-chart .vertical-bar-chart {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    position: relative;
 
}

.vaghtchin-surface-chart .vertical-bar-chart.dark {
    background: linear-gradient(145deg, #1e293b, #0f172a);
}

.vaghtchin-surface-chart #appointmentsChart {
    width: 100% !important;
    max-width: 100% !important;
}

/* حذف اسکرول‌بار */
.vaghtchin-surface-chart .vertical-bar-chart::-webkit-scrollbar {
    display: none;
}
.vaghtchin-surface-chart .vertical-bar-chart {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* استایل‌های موبایل */
@media (max-width: 768px) {
    .vaghtchin-surface-chart .vertical-bar-chart {
        min-height: 280px;
        padding: 15px 8px;
        border-radius: 12px;
    }
}

@media (max-width: 640px) {
    .vaghtchin-surface-chart .vertical-bar-chart {
        min-height: 250px;
        padding: 10px 5px;
        border-radius: 10px;
    }
}

/* دیت‌پیکر */
.vaghtchin-surface-chart .mds-persian-datetime-picker {
    z-index: 9999 !important;
}
.vaghtchin-surface-chart .apexcharts-bar-area {
    animation: slideUp 0.6s ease-out forwards;
    opacity: 0;
}

@keyframes slideUp {
    from {
        transform: scaleY(0);
        opacity: 0;
    }
    to {
        transform: scaleY(1);
        opacity: 1;
    }
}

/* تاخیر در انیمیشن برای هر ستون */
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(1) { animation-delay: 0.05s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(2) { animation-delay: 0.10s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(3) { animation-delay: 0.15s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(4) { animation-delay: 0.20s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(5) { animation-delay: 0.25s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(6) { animation-delay: 0.30s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(7) { animation-delay: 0.35s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(8) { animation-delay: 0.40s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(9) { animation-delay: 0.45s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(10) { animation-delay: 0.50s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(11) { animation-delay: 0.55s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(12) { animation-delay: 0.60s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(13) { animation-delay: 0.65s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(14) { animation-delay: 0.70s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(15) { animation-delay: 0.75s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(16) { animation-delay: 0.80s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(17) { animation-delay: 0.85s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(18) { animation-delay: 0.90s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(19) { animation-delay: 0.95s; }
.vaghtchin-surface-chart .apexcharts-bar-area:nth-child(20) { animation-delay: 1.00s; }

/* استایل حرفه‌ای برای تولتیپ */
.vaghtchin-surface-chart .apexcharts-tooltip {
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(12px);
    border: 1px solid rgba(45, 130, 247, 0.15) !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
    padding: 0 !important;
}

.vaghtchin-surface-chart .apexcharts-tooltip-title {
    background: linear-gradient(135deg, #2D82F7, #6AA9FF) !important;
    color: white !important;
    border-radius: 14px 14px 0 0 !important;
    padding: 10px 18px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    border-bottom: none !important;
}

.vaghtchin-surface-chart .apexcharts-tooltip-text {
    padding: 10px 18px !important;
    color: #1e293b !important;
    font-size: 13px !important;
}

.vaghtchin-surface-chart .apexcharts-tooltip-text-y-label {
    font-weight: 500 !important;
    color: #64748b !important;
}

.vaghtchin-surface-chart .apexcharts-tooltip-text-y-value {
    font-weight: 700 !important;
    color: #2D82F7 !important;
}

/* برچسب‌های محور X */
.vaghtchin-surface-chart .apexcharts-xaxis-label {
    font-weight: 500 !important;
}

/* خطوط شبکه */
.vaghtchin-surface-chart .apexcharts-gridline {
    stroke: #f1f5f9 !important;
    stroke-width: 0.5px !important;
}

/* حالت تاریک */
.vaghtchin-surface-chart .dark .vertical-bar-chart {
    background: linear-gradient(145deg, #1e293b, #0f172a);
}

/* ===== استایل جدید برای حذف استورک (هایلایت) روی کلیک ===== */
.vaghtchin-surface-chart .apexcharts-bar-area:hover {
    filter: brightness(1.05) !important;
}

.vaghtchin-surface-chart .apexcharts-bar-area:active {
    filter: brightness(1) !important;
}

/* حذف کامل افکت کلیک و استورک */
.vaghtchin-surface-chart .apexcharts-bar-area {
    transition: filter 0.15s ease !important;
    cursor: pointer !important;
}

/* غیرفعال کردن استایل استورک */
.vaghtchin-surface-chart .apexcharts-series .apexcharts-bar-area {
    stroke: none !important;
}

.vaghtchin-surface-chart .apexcharts-series .apexcharts-bar-area.active {
    stroke: none !important;
    filter: none !important;
}

/* استایل کلیک - بدون تغییر */
.vaghtchin-surface-chart .apexcharts-series .apexcharts-bar-area:focus {
    outline: none !important;
}

/* پاک کردن هر گونه هایلایت */
.vaghtchin-surface-chart .apexcharts-data-labels .apexcharts-datalabel {
    pointer-events: none !important;
}

/* جلوگیری از تغییر رنگ در حالت های مختلف */
.vaghtchin-surface-chart .apexcharts-series .apexcharts-bar-area[data-state="active"] {
    filter: none !important;
}

.vaghtchin-surface-chart .apexcharts-series .apexcharts-bar-area[data-state="hover"] {
    filter: brightness(1.05) !important;
}



/* booking */

    /* ===== Booking filters responsive layout =====
       Desktop: one row | Tablet: two rows | Mobile: stacked */
    @media (min-width: 1280px) {
        .vaghtchin-surface-booking .bkap-booking-filters {
            grid-template-columns: repeat(var(--booking-filter-columns,5), minmax(0, 1fr)) !important;
        }
    }
    @media (min-width: 768px) and (max-width: 1279px) {
        .vaghtchin-surface-booking .bkap-booking-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        }
    }
    @media (max-width: 767px) {
        .vaghtchin-surface-booking .bkap-booking-filters {
            grid-template-columns: minmax(0, 1fr) !important;
        }
    }

    /* ===== Status Badges ===== */
.vaghtchin-surface-booking .status-approved {
    color: #166534;
    background-color: transparent;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
     display: flex;
 justify-content: center;
  align-content: center;
  align-items: center;
  gap: 8px;
 white-space: nowrap; }

  .vaghtchin-surface-booking .appointment-status-icon {
	font-size: 20px;
	border-radius: 8px;
	padding: 4px;
    
}

.vaghtchin-surface-booking .status-pending {
    color: #b45309;
    background-color: transparent;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
     display: flex;
 justify-content: center;
  align-content: center;
  align-items: center;
  gap: 8px;
 white-space: nowrap; }

.vaghtchin-surface-booking .status-canceled {
    color: #b91c1c;
    background-color: transparent;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
     display: flex;
 justify-content: center;
  align-content: center;
  align-items: center;
  gap: 8px;
 white-space: nowrap; }

.vaghtchin-surface-booking .status-rejected {
    color: #4b5563;
    background-color: transparent;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
     display: flex;
   justify-content: center;
  align-content: center;
  align-items: center;
  gap: 8px;
   white-space: nowrap; 
}
.vaghtchin-surface-booking .status-cell.status-finall-approved {
	font-size: 14px;
}
.vaghtchin-surface-booking .status-default {
    color: #475569;
    background-color: transparent;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
 justify-content: center;
 display: flex;
  align-content: center;
  align-items: center;
  gap: 8px;
 white-space: nowrap; }

/* ===== Toast / Sortable / Text Colors =====
   استایل توست و ستون‌های مرتب‌سازی در assets/css/bkap-components.css است */

/* TomSelect dimensions are supplied by panel-consistency.css. */

/* ===== Inputs ===== */
.vaghtchin-surface-booking [type="text"],
.vaghtchin-surface-booking input:where(:not([type])),
.vaghtchin-surface-booking [type="email"],
.vaghtchin-surface-booking [type="url"],
.vaghtchin-surface-booking [type="password"],
.vaghtchin-surface-booking [type="number"],
.vaghtchin-surface-booking [type="date"],
.vaghtchin-surface-booking [type="datetime-local"],
.vaghtchin-surface-booking [type="month"],
.vaghtchin-surface-booking [type="search"],
.vaghtchin-surface-booking [type="tel"],
.vaghtchin-surface-booking [type="time"],
.vaghtchin-surface-booking [type="week"],
.vaghtchin-surface-booking [multiple],
.vaghtchin-surface-booking textarea,
.vaghtchin-surface-booking select {
    font-size: 14px;
    color: #787f8c;
}

/* ===== Spinner Animation ===== */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.vaghtchin-surface-booking .animate-spin {
    animation: spin 1s linear infinite;
}

.vaghtchin-surface-booking .statusfl{
    justify-content: space-between;
}
.vaghtchin-surface-booking .status-cell.status-finall-approved {
	display: flex;
	gap: 8px;
}
/* ===== Responsive ===== */
@media (max-width: 768px) {
    .vaghtchin-surface-booking .content {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    
    .vaghtchin-surface-booking .container {
        padding: 16px!important;
    }
}

/* ===== Print Button Hover ===== */
.vaghtchin-surface-booking a[title="پرینت"]:hover svg {
    transform: scale(1.1);
    transition: transform 0.2s;
}

/* هاور ردیف‌های جدول در .bkap-table (assets/css/bkap-components.css) اعمال می‌شود */







    

/* reports/financial */

    .vaghtchin-surface-reports-financial .apexcharts-toolbar {
        display: none;
    }

    /* ---------- اسکلت بارگذاری کارت‌های خلاصه ---------- */
    @keyframes bkapShimmer {
        0%   { background-position: 100% 0; }
        100% { background-position: -100% 0; }
    }

    .vaghtchin-surface-reports-financial #financialSummary.is-loading .fin-value {
        min-width: 96px;
        color: transparent !important;
        border-radius: 6px;
        background-image: linear-gradient(90deg,
            rgba(148, 163, 184, .18) 25%,
            rgba(148, 163, 184, .34) 37%,
            rgba(148, 163, 184, .18) 63%);
        background-size: 200% 100%;
        animation: bkapShimmer 1.3s ease-in-out infinite;
    }

    .vaghtchin-surface-reports-financial #financialSummary.is-loading .fin-value--on-dark {
        background-image: linear-gradient(90deg,
            rgba(255, 255, 255, .22) 25%,
            rgba(255, 255, 255, .45) 37%,
            rgba(255, 255, 255, .22) 63%);
    }

    .vaghtchin-surface-reports-financial #financialSummary.is-loading .fin-pill {
        visibility: hidden;
    }

    /* ---------- کارت‌های خلاصه ---------- */
    .vaghtchin-surface-reports-financial .fin-card {
        transition: transform .2s ease, box-shadow .2s ease;
    }

    .vaghtchin-surface-reports-financial .fin-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
    }

    /* ---------- نمودارهای دونات ---------- */
    .vaghtchin-surface-reports-financial .fin-donut {
        position: relative;
        min-height: 320px;
    }

    .vaghtchin-surface-reports-financial .fin-donut .chart-loader,
    .vaghtchin-surface-reports-financial .fin-donut-empty {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

    .vaghtchin-surface-reports-financial .fin-donut-empty.hidden,
    .vaghtchin-surface-reports-financial .fin-donut .chart-loader.hidden {
        display: none;
    }

    .vaghtchin-surface-reports-financial #financialRefresh.is-busy svg {
        animation: spin .8s linear infinite;
    }


/* reports/inventory */

    .vaghtchin-surface-reports-inventory .apexcharts-toolbar {
        display: none;
    }

    /* ---------- اسکلت بارگذاری کارت‌ها ---------- */
    @keyframes bkapShimmer {
        0%   { background-position: 100% 0; }
        100% { background-position: -100% 0; }
    }

    .vaghtchin-surface-reports-inventory .is-loading .inv-value {
        min-width: 72px;
        color: transparent !important;
        border-radius: 6px;
        background-image: linear-gradient(90deg,
            rgba(148, 163, 184, .18) 25%,
            rgba(148, 163, 184, .34) 37%,
            rgba(148, 163, 184, .18) 63%);
        background-size: 200% 100%;
        animation: bkapShimmer 1.3s ease-in-out infinite;
    }

    .vaghtchin-surface-reports-inventory .is-loading .inv-value--on-dark {
        background-image: linear-gradient(90deg,
            rgba(255, 255, 255, .22) 25%,
            rgba(255, 255, 255, .45) 37%,
            rgba(255, 255, 255, .22) 63%);
    }

    .vaghtchin-surface-reports-inventory .is-loading .inv-pill,
    .vaghtchin-surface-reports-inventory .is-loading .inv-hint {
        visibility: hidden;
    }

    /* ---------- کارت‌ها ---------- */
    .vaghtchin-surface-reports-inventory .inv-card {
        transition: transform .2s ease, box-shadow .2s ease;
    }

    .vaghtchin-surface-reports-inventory .inv-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
    }

    /* ---------- ظرف نمودارها ---------- */
    .vaghtchin-surface-reports-inventory .inv-chart {
        position: relative;
        min-height: 320px;
    }

    .vaghtchin-surface-reports-inventory .inv-chart--tall {
        min-height: 360px;
    }

    .vaghtchin-surface-reports-inventory .inv-chart .chart-loader,
    .vaghtchin-surface-reports-inventory .inv-chart__empty {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

    .vaghtchin-surface-reports-inventory .inv-chart__empty.hidden,
    .vaghtchin-surface-reports-inventory .inv-chart .chart-loader.hidden {
        display: none;
    }

    .vaghtchin-surface-reports-inventory #inventoryRefresh.is-busy svg {
        animation: spin .8s linear infinite;
    }

    /* ---------- کلید تغییر نمای نمودار میله‌ای ---------- */
    .vaghtchin-surface-reports-inventory .inv-toggle {
        display: inline-flex;
        padding: 3px;
        border-radius: 9999px;
        background: #f1f5f9;
    }

    .vaghtchin-surface-reports-inventory .inv-toggle__btn {
        padding: 4px 14px;
        font-size: 12px;
        font-weight: 500;
        color: #64748b;
        border-radius: 9999px;
        cursor: pointer;
        transition: background-color .2s ease, color .2s ease;
    }

    .vaghtchin-surface-reports-inventory .inv-toggle__btn.is-active {
        background: #ffffff;
        color: #0f172a;
        box-shadow: 0 1px 3px rgba(15, 23, 42, .12);
    }

    /* ---------- نوار سهم تجویز در جدول ---------- */
    .vaghtchin-surface-reports-inventory .inv-share {
        display: block;
        flex: 1;
        min-width: 40px;
        max-width: 140px;
        height: 6px;
        border-radius: 9999px;
        background: #f1f5f9;
        overflow: hidden;
    }

    .vaghtchin-surface-reports-inventory .inv-share__fill {
        display: block;
        height: 100%;
        border-radius: 9999px;
        background: linear-gradient(90deg, rgb(var(--color-primary)), #7ADFCD);
    }

    /* ---------- ردیف هشدار موجودی ---------- */
    .vaghtchin-surface-reports-inventory .inv-alert {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 12px 16px;
        border-radius: 10px;
        border: 1px dashed rgba(240, 101, 90, .45);
        background: rgba(240, 101, 90, .06);
        color: #b3241a;
        font-size: 13px;
    }

    .vaghtchin-surface-reports-inventory .inv-alert.hidden {
        display: none;
    }
    .vaghtchin-surface-reports-inventory .grid-responsive {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

/* تبلت */
@media (min-width: 640px) {
  .vaghtchin-surface-reports-inventory .grid-responsive {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* دسکتاپ */
@media (min-width: 1024px) {
  .vaghtchin-surface-reports-inventory .grid-responsive {
    grid-template-columns: repeat(4, 1fr);
  }
}
.vaghtchin-surface-reports-inventory .inv-pill.rtl\:mr-3\.5.ltr\:ml-3\.5.flex.items-center.rounded-full.border.border-warning\/50.bg-warning\/70.py-\[2px\].rtl\:pr-\[7px\].ltr\:pl-\[7px\].rtl\:pl-1.ltr\:pr-1.text-xs.font-medium.text-white\/90 {
	background-color: #e28f24;
}


/* payments/index */

    .vaghtchin-surface-payments-index .status-paid {
        color: #166534;
        background-color: #d4edda;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-payments-index .status-pending {
        color: #b45309;
        background-color: #ffe8cc;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-payments-index .status-canceled {
        color: #b91c1c;
        background-color: #f8d7da;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }
    .vaghtchin-surface-payments-index .status-not-paid {
        color: #4b5563;
        background-color: #e9ecef;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.75rem;
        font-weight: 500;
        display: inline-block;
    }

    /* استایل توست و ستون‌های مرتب‌سازی در assets/css/bkap-components.css است */

    .vaghtchin-surface-payments-index .payment-modal-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 99999;
        justify-content: center;
        align-items: center;
    }
    .vaghtchin-surface-payments-index .payment-modal-overlay.active {
        display: flex;
    }
    .vaghtchin-surface-payments-index .payment-modal-box {
        background: #fff;
        border-radius: 12px;
        max-width: 700px;
        width: 95%;
        max-height: 90vh;
        overflow-y: auto;
        box-shadow: 0 20px 60px rgba(0,0,0,0.3);
        animation: modalFadeIn 0.2s ease-out;
    }
    @keyframes modalFadeIn {
        from { transform: scale(0.95); opacity: 0; }
        to { transform: scale(1); opacity: 1; }
    }

    .vaghtchin-surface-payments-index .modal-loader {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255,255,255,0.8);
        z-index: 10;
        justify-content: center;
        align-items: center;
        border-radius: 12px;
    }
    .vaghtchin-surface-payments-index .modal-loader.active {
        display: flex;
    }
    .vaghtchin-surface-payments-index .modal-loader .spinner {
        width: 50px;
        height: 50px;
        border: 5px solid #e5e7eb;
        border-top-color: #3b82f6;
        border-radius: 50%;
        animation: spin 0.8s linear infinite;
    }
    @keyframes spin {
        to { transform: rotate(360deg); }
    }

    .vaghtchin-surface-payments-index .form-control {
        display: block;
        width: 100%;
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        line-height: 1.5;
        color: #1f2937;
        background-color: #fff;
        border: 1px solid #d1d5db;
        border-radius: 0.375rem;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
    .vaghtchin-surface-payments-index .form-control:focus {
        border-color: #3b82f6;
        outline: 0;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
    }
    .vaghtchin-surface-payments-index .form-control[readonly] {
        background-color: #f3f4f6;
        cursor: not-allowed;
    }

    .vaghtchin-surface-payments-index .prices-section {
        background: #f8fafc;
        padding: 1rem;
        border-radius: 0.5rem;
        margin-bottom: 1rem;
    }

    .vaghtchin-surface-payments-index .btn-primary {
        background-color: #3b82f6;
        color: #fff;
        padding: 0.5rem 1.5rem;
        border: none;
        border-radius: 0.375rem;
        font-weight: 500;
        cursor: pointer;
        transition: background-color 0.15s;
    }
    .vaghtchin-surface-payments-index .btn-primary:hover { background-color: #2563eb; }
    .vaghtchin-surface-payments-index .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
    .vaghtchin-surface-payments-index .btn-secondary {
        background-color: #e5e7eb;
        color: #374151;
        padding: 0.5rem 1.5rem;
        border: none;
        border-radius: 0.375rem;
        font-weight: 500;
        cursor: pointer;
        transition: background-color 0.15s;
    }
    .vaghtchin-surface-payments-index .btn-secondary:hover { background-color: #d1d5db; }

    .vaghtchin-surface-payments-index .spinner-border {
        display: inline-block;
        width: 2rem;
        height: 2rem;
        vertical-align: text-bottom;
        border: 0.25em solid currentColor;
        border-right-color: transparent;
        border-radius: 50%;
        animation: spinner-border 0.75s linear infinite;
    }
    @keyframes spinner-border {
        to { transform: rotate(360deg); }
    }
    .vaghtchin-surface-payments-index .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;
    }

    /* ظاهر جدول از .bkap-table در assets/css/bkap-components.css می‌آید */


/* pharmacy/index */

/* ============================================
   استایل‌های مودال
   ============================================ */
.vaghtchin-surface-pharmacy-index .pharmacy-modal {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    padding: 20px;
}

.vaghtchin-surface-pharmacy-index .pharmacy-modal.show {
    display: flex !important;
}

.vaghtchin-surface-pharmacy-index .pharmacy-modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 99998;
}

.vaghtchin-surface-pharmacy-index .pharmacy-modal-container {
    position: relative;
    z-index: 99999;
    width: 90%;
    max-width: 500px;
    margin: auto;
}

.vaghtchin-surface-pharmacy-index .pharmacy-modal-content {
    position: relative;
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    padding: 30px 24px;
}

/* لودر روی کانتینر مودال (همان الگوی مودال پرداخت‌ها) */
.vaghtchin-surface-pharmacy-index .modal-loader {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 10;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 12px;
}

.vaghtchin-surface-pharmacy-index .modal-loader.active {
    display: flex;
}

.vaghtchin-surface-pharmacy-index .modal-loader__spinner {
    width: 44px;
    height: 44px;
    border: 4px solid #e5e7eb;
    border-top-color: rgb(var(--color-primary));
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.vaghtchin-surface-pharmacy-index .modal-loader__text {
    font-size: 0.8125rem;
    color: #64748b;
}

.vaghtchin-surface-pharmacy-index .prescription-modal {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
}

.vaghtchin-surface-pharmacy-index .prescription-modal.show {
    display: flex !important;
}

.vaghtchin-surface-pharmacy-index .prescription-modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99998;
}

.vaghtchin-surface-pharmacy-index .prescription-modal-container {
    position: relative;
    z-index: 99999;
    width: 90%;
    max-width: 500px;
    margin: auto;
}

.vaghtchin-surface-pharmacy-index .prescription-modal-content {
    background: white;
    border-radius: 12px;
    padding: 24px;
}

.vaghtchin-surface-pharmacy-index body.modal-open {
    overflow: hidden;
}

/* نشانِ ستون «موجودی» (.bkap-stock-badge) در assets/css/bkap-components.css است
   تا صفحه گزارش انبار هم همان رنگ‌ها را بگیرد. کلاس‌ها را
   Pharmacy::stockDisplay() تولید می‌کند. */

/* =====================================================
   سویچ‌های «حالت موجودی» دارو
   رادیوی مخفی + اسلایدر؛ همان ظاهر سویچ‌های صفحه تنظیمات
   (includes/Views/settings.php) تا رابط کاربری یکدست بماند.
   ===================================================== */
.vaghtchin-surface-pharmacy-index .bkap-stock-modes {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vaghtchin-surface-pharmacy-index .bkap-stock-mode {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.vaghtchin-surface-pharmacy-index .bkap-stock-mode:hover {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .06);
}
/* گزینه فعال با حاشیه و پس‌زمینه سبز مشخص می‌شود */
.vaghtchin-surface-pharmacy-index .bkap-stock-mode:has(input:checked) {
    border-color: #bbf7d0;
    background: #f8fefb;
}

.vaghtchin-surface-pharmacy-index .bkap-switch {
    position: relative;
    flex: 0 0 auto;
    width: 46px;
    height: 26px;
}
.vaghtchin-surface-pharmacy-index .bkap-switch input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}
.vaghtchin-surface-pharmacy-index .bkap-switch-slider {
    position: absolute;
    inset: 0;
    background: #cbd5e1;
    border-radius: 9999px;
    transition: background .2s ease;
}
.vaghtchin-surface-pharmacy-index .bkap-switch-slider::before {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 9999px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
    transition: transform .2s ease;
}
.vaghtchin-surface-pharmacy-index .bkap-switch input:checked ~ .bkap-switch-slider {
    background: #22c55e;
}
/* در چیدمان راست‌به‌چپ، دستهٔ سویچ به سمت چپ حرکت می‌کند */
.vaghtchin-surface-pharmacy-index .bkap-switch input:checked ~ .bkap-switch-slider::before {
    transform: translateX(-20px);
}
.vaghtchin-surface-pharmacy-index .bkap-switch input:focus-visible ~ .bkap-switch-slider {
    box-shadow: 0 0 0 3px rgba(34, 197, 94, .25);
}

/* استایل توست در assets/css/bkap-components.css است */

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.vaghtchin-surface-pharmacy-index .animate-spin {
    animation: spin 1s linear infinite;
}


/* pharmacy/prescription */


    /* ---------- انتخابگر مشتری/نوبت ---------- */
    .vaghtchin-surface-pharmacy-prescription #rxAppointmentSelect + .ts-wrapper .ts-control,
    .vaghtchin-surface-pharmacy-prescription .rx-picker .ts-wrapper .ts-control {
        min-height: 42px;
        border-radius: 0.5rem;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-picker .ts-dropdown {
        border-radius: 0.6rem;
        overflow: hidden;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-picker .ts-dropdown .optgroup-header {
        background: rgb(var(--color-primary) / 0.08);
        color: rgb(var(--color-primary));
        font-weight: 700;
        font-size: 0.75rem;
        padding: 0.5rem 0.75rem;
        border-top: 1px solid #eef2f7;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
        padding: 0.15rem 0;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option-top {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option-name {
        font-size: 0.875rem;
        font-weight: 700;
        color: #1e293b;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option-no {
        font-size: 0.7rem;
        font-weight: 700;
        padding: 0.1rem 0.45rem;
        border-radius: 999px;
        background: rgb(var(--color-primary) / 0.12);
        color: rgb(var(--color-primary));
        direction: rtl;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option-meta {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        flex-wrap: wrap;
        font-size: 0.72rem;
        color: #64748b;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-option-meta .rx-dot {
        width: 3px;
        height: 3px;
        border-radius: 999px;
        background: #cbd5e1;
        display: inline-block;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-item-label {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.85rem;
    }

    /* ---------- نشان وضعیت نوبت ---------- */
    .vaghtchin-surface-pharmacy-prescription .rx-status {
        display: inline-flex;
        align-items: center;
        font-size: 0.7rem;
        font-weight: 700;
        padding: 0.12rem 0.5rem;
        border-radius: 999px;
        white-space: nowrap;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-status--approved {
        background: #dcfce7;
        color: #15803d;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-status--pending {
        background: #fef9c3;
        color: #a16207;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-status--canceled {
        background: #fee2e2;
        color: #b91c1c;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-status--rejected {
        background: #f3e8ff;
        color: #7e22ce;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-status--default {
        background: #f1f5f9;
        color: #475569;
    }

    /* ---------- کارت خلاصهٔ نوبت انتخاب‌شده ---------- */
    .vaghtchin-surface-pharmacy-prescription .rx-summary-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem 1rem;
    }

    @media (min-width: 768px) {
        .vaghtchin-surface-pharmacy-prescription .rx-summary-grid {
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-cell {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        min-width: 0;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-key {
        font-size: 0.7rem;
        color: #94a3b8;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-val {
        font-size: 0.82rem;
        font-weight: 600;
        color: #334155;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* ---------- قفل فرم تا زمان انتخاب نوبت ---------- */
    .vaghtchin-surface-pharmacy-prescription .rx-form-wrapper {
        position: relative;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-form-wrapper.rx-locked .rx-form-inner {
        pointer-events: none;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
        opacity: 0.45;
        filter: grayscale(0.4);
    }

    .vaghtchin-surface-pharmacy-prescription .rx-lock-note {
        display: none;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-form-wrapper.rx-locked .rx-lock-note {
        display: flex;
    }

    /* ---------- انیمیشن ورود کارت خلاصه ---------- */
    @keyframes rxFadeIn {
        from {
            opacity: 0;
            transform: translateY(-4px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .vaghtchin-surface-pharmacy-prescription .rx-fade-in {
        animation: rxFadeIn 0.18s ease-out;
    }

    /* ظاهر کادر «فرم قفل است».
       عمداً هیچ display اینجا نیست: نشان‌دادن/پنهان‌کردن فقط با دو قاعدهٔ بالا
       (.rx-lock-note{display:none} و .rx-form-wrapper.rx-locked .rx-lock-note)
       انجام می‌شود. پیش‌تر همین قاعده display:flex داشت و چون ویژگی‌اش
       (۱۲ کلاس) از .rx-lock-note بیشتر بود، کادر «تا انتخاب نوبت غیرفعال است»
       بعد از انتخاب مشتری هم روی صفحه می‌ماند و در موبایل جای زیادی می‌گرفت. */
    .vaghtchin-surface-pharmacy-prescription .rx-lock-note {
	align-items: flex-start;
	gap: 10px;
	padding: 12px 16px;
	border-radius: 10px;
	border: 1px dashed rgba(240, 101, 90, .45);
	background: rgba(240, 101, 90, .06);
	color: #b3241a;
	font-size: 14px;
    margin-top: 28px;
}

.vaghtchin-surface-pharmacy-prescription .ts-control:not(.rtl) {
	padding-right: 12px!important;
}
.vaghtchin-surface-pharmacy-prescription .flex.flex-col.gap-y-3.md\:min-h-10.md\:flex-row.md\:items-center.justify-between {
	justify-content: space-between;
}

    /* =========================================================
       رسپانسیو موبایل
       ---------------------------------------------------------
       نکتهٔ مهم: assets/css/app.css یک بیلد آمادهٔ Tailwind است و
       tailwind.config.js فقط ./src را اسکن می‌کند، پس کلاس‌هایی که در
       includes/Views نوشته می‌شوند اگر از قبل در بیلد نباشند «هیچ» کاری
       نمی‌کنند. در همین صفحه این‌ها بی‌اثرند:
         shrink-0 · justify-between · bg-green-50 · min-h-[132px]
         flex-[0_0_20%] · flex-[0_0_80%] · max-h-[600px] · md:ms-auto
       بنابراین چیدمان را با CSS معمولی می‌سازیم، نه با کلاس تازهٔ Tailwind.
       ========================================================= */

    /* سربرگ ثابت موبایل (‎.mobile-header‎، ارتفاع ۶۴px، position:fixed) روی
       ابتدای ‎.content‎ می‌افتاد و تیتر صفحه زیر آن گم می‌شد. */
    @media (max-width: 1279px) {
        .vaghtchin-surface-pharmacy-prescription .content.rx-page {
            padding-top: 84px;
        }
    }

    /* ---------- کارت خلاصه: چیدمان پایه ---------- */
    .vaghtchin-surface-pharmacy-prescription #rxSummary {
        background: #f0fdf494;          /* جای bg-green-50 که در بیلد نیست */
        justify-content: space-between; /* جای justify-between */
    }

    .vaghtchin-surface-pharmacy-prescription #rxSummaryEmpty {
        min-height: 132px;            /* جای min-h-[132px] */
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-head {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-avatar {
        flex: 0 0 auto;               /* جای shrink-0 */
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-ident {
        flex: 1 1 10rem;
        min-width: 0;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-actions {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex: 0 0 auto;
        margin-inline-start: auto;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-summary-actions > a,
    .vaghtchin-surface-pharmacy-prescription .rx-summary-actions > button {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .vaghtchin-surface-pharmacy-prescription #rxSummaryName {
        overflow-wrap: anywhere;
    }

    /* شمارهٔ تماس dir="ltr" است؛ بدون inline-block داخل قالب راست‌به‌چپ
       به لبهٔ مخالفِ نام می‌چسبد. */
    .vaghtchin-surface-pharmacy-prescription #rxSummaryPhone {
        display: inline-block;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    /* ---------- انتخابگر: سرریز نکردن در عرض کم ---------- */
    .vaghtchin-surface-pharmacy-prescription .rx-picker .ts-control > .item {
        max-width: 100%;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-item-label {
        flex-wrap: wrap;
        max-width: 100%;
    }

    .vaghtchin-surface-pharmacy-prescription .rx-picker .ts-dropdown .option {
        white-space: normal;
    }

    /* ---------- کارت خلاصه در گوشی ---------- */
    @media (max-width: 639px) {
        .vaghtchin-surface-pharmacy-prescription #rxSummary {
            padding: 0.875rem;
        }

        .vaghtchin-surface-pharmacy-prescription .rx-summary-ident {
            flex: 1 1 auto;
        }

        /* دکمه‌های «پروندهٔ رزرو / تغییر» به خط بعد می‌روند و نصف‌نصف پهن می‌شوند،
           وگرنه ستون نام را له می‌کردند. */
        .vaghtchin-surface-pharmacy-prescription .rx-summary-actions {
            flex: 0 0 100%;
            margin-inline-start: 0;
        }

        .vaghtchin-surface-pharmacy-prescription .rx-summary-actions > a,
        .vaghtchin-surface-pharmacy-prescription .rx-summary-actions > button {
            flex: 1 1 0;
            min-width: 0;
        }

        .vaghtchin-surface-pharmacy-prescription .rx-summary-grid {
            gap: 0.625rem 0.75rem;
        }

        /* در عرض کم، شکستن خط بهتر از بریدن مقدار با «...» است */
        .vaghtchin-surface-pharmacy-prescription .rx-summary-val {
            white-space: normal;
            overflow: visible;
            overflow-wrap: anywhere;
            line-height: 1.55;
        }
    }


/* The approved medicine form is styled by shared rx-presentation.css. */

/* partials/_layout */



.vaghtchin-panel #date_buttons {
	padding: 14px;
	background-color: white;
	border-radius: 14px;
}
.vaghtchin-panel body::before {
	content: '';
	position: fixed !important;
	inset: 0 !important;
	pointer-events: none;
	z-index: 4 !important;
	background-image: linear-gradient(rgba(34,197,94,.04)1px,transparent 1px),linear-gradient(90deg,rgba(34,197,94,.04)1px,transparent 1px),linear-gradient(rgba(34,197,94,.02)1px,transparent 1px),linear-gradient(90deg,rgba(34,197,94,.02)1px,transparent 1px) !important;
	background-size: 100px 100px,100px 100px,20px 20px,20px 20px !important;
}


        /* موبایل */
@media screen and (max-width: 1024px)  {
  .vaghtchin-panel #cg,.vaghtchin-panel #cl-m {
    flex-direction: column;
    display: flex;
  }}

  .vaghtchin-panel .apexcharts-toolbar {
	display: none;
}
  .vaghtchin-panel #hedm {
	display: flex;
	justify-content: space-between;
	width: 100%;
	align-items: center;
}
.vaghtchin-panel .bg-red-500 {
  background-color: #ef4444;
}

.vaghtchin-panel #addToListBtn {
	width: 80%;
}
.vaghtchin-panel #confirmDeleteModal {
	z-index: 999;
}
.vaghtchin-panel .w-\[90\%\].mx-auto.bg-white.relative.rounded-md.shadow-md.transition-\[margin-top\,transform\].duration-\[0\.4s\,0\.3s\].-mt-16.group-\[\.show\]\:mt-16.group-\[\.modal-static\]\:scale-\[1\.05\].dark\:bg-darkmode-600.sm\:w-\[460px\].p-6 {
	margin-top: 6rem;
	padding: 14px;
}
.vaghtchin-panel #confirmDeleteBtn {
	color: white;
}

.vaghtchin-panel #clearSelectionBtn {
	width: 20%;
	padding: 8px;
}
  
        .vaghtchin-panel #groupDescriptionDisplay {
	width: 86%;
    white-space: unset!important;
}
.vaghtchin-panel .text-danger { color:#f56565 !important; }
.vaghtchin-panel .text-warning { color:#f59e0b !important; }
.vaghtchin-panel .text-success { color:#48bb78 !important; }
.vaghtchin-panel .text-info { color:#4299e1 !important; }

/* استایل .floating-toast در assets/css/bkap-components.css است */
.vaghtchin-panel .hedt{
    background-color:rgb(0, 88, 74) ;
}
.vaghtchin-panel #hed1{
    justify-content: space-between;
}
.vaghtchin-panel #confirm-delete-prescription-btn,.vaghtchin-panel #confirm-delete-medicine-btn {
	background-color: red;
}

/* چیدمان #form_fields_container در includes/Views/visit-form.php است */

/* استایل لودر */
.vaghtchin-panel .chart-loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
}
.vaghtchin-panel .loader-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #e2e8f0;
    border-top: 4px solid #2D82F7;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
.vaghtchin-panel .loader-text {
    margin-top: 8px;
    color: #94a3b8;
    font-size: 12px;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

html.vaghtchin-panel {
    --color-primary: 17 170 146 !important; /* rgb(var(--color-primary)) به RGB */
    --color-secondary: 59 130 246!important; /* #3b82f6 به RGB */
}

/* اگر دارک مود فعال است */
.vaghtchin-panel .dark {
    --color-primary: 13 138 119 !important; /* نسخه تیره‌تر */
    --color-secondary: 59 130 246!important; /* #3b82f6 به RGB */

}

   .vaghtchin-panel .loading-page--before-hide::before {
            content: '';
            display: block;
            position: fixed;
            inset: 0;
            width: 100vw;
            height: 100vh;
            background: #2D82F7;
            z-index: 60;
            transition: opacity 0.3s;
        }
        
        .vaghtchin-panel .loading-page--hide::before {
            opacity: 0;
        }
        
        .vaghtchin-panel .loading-page--before-hide::after {
            content: '';
            display: block;
            position: fixed;
            inset: 0;
            margin: auto;
            width: 64px;
            height: 64px;
            background-size: cover;
            background-repeat: no-repeat;
            animation: pulse 1.5s ease-in-out infinite;
            z-index: 61;
            opacity: 0.5;
            transition: opacity 0.3s;
        }
        
        .vaghtchin-panel .loading-page--hide::after {
            opacity: 0;
        }
        
        @keyframes pulse {
            0%, 100% {
                transform: scale(0.8);
                opacity: 0.5;
            }
            50% {
                transform: scale(1);
                opacity: 1;
            }
        }


        

















html.vaghtchin-panel[lang="fa"] body {
    font-family: 'YekanBakhFaNum'!important;
}

   .vaghtchin-panel #date_buttons .date_button.active_btn {
	background: rgb(var(--color-primary))!important;
	color: #fff;
}
.vaghtchin-panel .dagger .side-menu ul.scrollable > li > .side-menu__link--active {
	color: #fff;
	background: linear-gradient(to right,rgb(var(--color-primary)),color-mix(in srgb,rgb(var(--color-primary)) 72%,black))!important;
	box-shadow:  none!important;
}
.vaghtchin-panel .box-icon-div {
	right: unset !important;
	left: 10 !important;
}


.vaghtchin-panel .w-fit.rtl\:ml-auto.ltr\:mr-auto.flex.items-center.rounded-md.border.border-success\/10.bg-success\/10.px-3.py-1.text-base.font-semibold.text-success {
	width: -moz-fit-content;
	width: fit-content;
}



/* ============================================
   بازسازی کامل چیدمان فرم
   ============================================ */

/* 1. تغییر گریید اصلی به 3 ستون برای نمایش بهتر */
.vaghtchin-panel #form_fields_container {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    padding: 8px !important;
}


/* 2. هر فیلد را کارت گونه کنید */
/*.visit-form-container .form-field {*/
/*    background: white !important;*/
/*    border: 1px solid #e2e8f0 !important;*/
/*    border-radius: 10px !important;*/
/*    padding: 12px 14px !important;*/
/*    margin: 0 !important;*/
/*    transition: all 0.2s ease !important;*/
/*    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;*/
/*}*/

.vaghtchin-panel .visit-form-container .form-field:hover {
    border-color: #94a3b8 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}

/* 3. لیبل فیلدها */
.vaghtchin-panel .visit-form-container .form-field > label:first-child {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-bottom: 8px !important;
    display: block !important;
    padding-bottom: 4px !important;
    border-bottom: 2px solid #f1f5f9 !important;
}

/* 4. چک‌باکس‌های افقی با استایل مدرن */
.vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 5px 12px !important;
    margin: 0 !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 20px !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #334155 !important;
}

.vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 label:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
    transform: translateY(-1px);
}

.vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 label:has(input:checked) {
    background: #dbeafe !important;
    border-color: #3b82f6 !important;
    color: #1e40af !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    accent-color: #3b82f6 !important;
}

/* 5. ورودی‌های متنی */
.vaghtchin-panel .visit-form-container .form-field input[type="text"],
.vaghtchin-panel .visit-form-container .form-field input[type="number"],
.vaghtchin-panel .visit-form-container .form-field textarea {
    width: 100% !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 8px !important;
    background: #fafbfc !important;
    transition: all 0.2s ease !important;
}

.vaghtchin-panel .visit-form-container .form-field input[type="text"]:focus,
.vaghtchin-panel .visit-form-container .form-field input[type="number"]:focus,
.vaghtchin-panel .visit-form-container .form-field textarea:focus {
    border-color: #3b82f6 !important;
    background: white !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
    outline: none !important;
}

/* 6. واکنش‌گرا */
@media (max-width: 1200px) {
    .vaghtchin-panel #form_fields_container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .vaghtchin-panel #form_fields_container {
        grid-template-columns: 1fr !important;
    }
    
    .vaghtchin-panel .visit-form-container .form-field .flex.flex-col.gap-2 label {
        padding: 4px 10px !important;
        font-size: 11px !important;
    }
}

/* 7. برای فیلدهایی با گزینه‌های زیاد (Cag, Ccta و ...) */
.vaghtchin-panel .form-field[data-input-id="145"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="141"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="135"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="128"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="127"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="180"] .flex.flex-col.gap-2 label,
.vaghtchin-panel .form-field[data-input-id="192"] .flex.flex-col.gap-2 label {
    padding: 3px 8px !important;
    font-size: 11px !important;
    border-radius: 14px !important;
}
.vaghtchin-panel .bg-red-500 {
  background-color: #ef4444;
}


.vaghtchin-panel #extras_container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .vaghtchin-panel #extras_container {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .vaghtchin-panel #extras_container {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* برای زیباتر شدن در گرید، border-bottom رو حذف و جایگزین با border کلی می‌کنیم */
.vaghtchin-panel #extras_container .extra-row {
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 1rem;
    background-color: #ffffff;
}

/* حذف border-bottom اضافی */
.vaghtchin-panel #extras_container .border-b {
    border-bottom: none !important;
}

/* بهینه‌سازی ورودی‌ها برای نمایش بهتر */
.vaghtchin-panel #extras_container .extra-qty {
    width: 100%;
    padding: 0.5rem;
}

.vaghtchin-panel #extras_container .flex {
    display: flex;
    gap: 0.75rem;
}

.vaghtchin-panel #extras_container .flex-col {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.vaghtchin-panel #extras_container .text-xs {
    font-size: 0.75rem;
    color: #94a3b8;
    white-space: nowrap;
}

.vaghtchin-panel #extras_container .font-medium {
    font-weight: 500;
}




    


/* profile/index */

        /* ===== استایل‌های اصلی ===== */
        .vaghtchin-surface-profile-index .tab-pane { display: none; }
        .vaghtchin-surface-profile-index .tab-pane.active { display: block; }
        
        /* ===== استایل‌های وضعیت رزرو ===== */
        .vaghtchin-surface-profile-index .status-approved {
            color: #166534;
            background-color: transparent;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 500;
            display: flex;
            justify-content: center;
            align-content: center;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
        }
        
        .vaghtchin-surface-profile-index .appointment-status-icon {
            font-size: 20px;
            border-radius: 8px;
            padding: 4px;
        }
        
        .vaghtchin-surface-profile-index .status-pending {
            color: #b45309;
            background-color: transparent;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 500;
            display: flex;
            justify-content: center;
            align-content: center;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
        }
        
        .vaghtchin-surface-profile-index .status-canceled {
            color: #b91c1c;
            background-color: transparent;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 500;
            display: flex;
            justify-content: center;
            align-content: center;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
        }
        
        .vaghtchin-surface-profile-index .status-rejected {
            color: #4b5563;
            background-color: transparent;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 500;
            display: flex;
            justify-content: center;
            align-content: center;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
        }
        
        .vaghtchin-surface-profile-index .status-default {
            color: #475569;
            background-color: transparent;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 500;
            justify-content: center;
            display: flex;
            align-content: center;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
        }
        
        /* ===== استایل‌های وضعیت پرداخت (مشابه payments.php) ===== */
        .vaghtchin-surface-profile-index .status-paid {
            color: #166534;
            background-color: #d4edda;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
            font-size: 0.75rem;
            font-weight: 500;
            display: inline-block;
        }
        
        .vaghtchin-surface-profile-index .status-pending-payment {
            color: #b45309;
            background-color: #ffe8cc;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
            font-size: 0.75rem;
            font-weight: 500;
            display: inline-block;
        }
        
        .vaghtchin-surface-profile-index .status-canceled-payment {
            color: #b91c1c;
            background-color: #f8d7da;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
            font-size: 0.75rem;
            font-weight: 500;
            display: inline-block;
        }
        
        .vaghtchin-surface-profile-index .status-not-paid {
            color: #4b5563;
            background-color: #e9ecef;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
            font-size: 0.75rem;
            font-weight: 500;
            display: inline-block;
        }
        
        .vaghtchin-surface-profile-index .statusfl {
            justify-content: space-between;
        }
        
        @keyframes spin {
            to { transform: rotate(360deg); }
        }
        .vaghtchin-surface-profile-index .animate-spin {
            animation: spin 1s linear infinite;
        }
        
        /* استایل توست (.floating-toast) در assets/css/bkap-components.css است */
        /* هاور ردیف‌های جدول در .bkap-table (همان فایل) اعمال می‌شود */

        /* ===== Status Cell ===== */
        .vaghtchin-surface-profile-index .status-cell.status-finall-approved {
            font-size: 14px;
        }
        
        .vaghtchin-surface-profile-index .status-cell {
            display: flex;
            gap: 8px;
        }
        
        /* ===== Payment Modal ===== */
        .vaghtchin-surface-profile-index .payment-modal-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.5);
            z-index: 99999;
            justify-content: center;
            align-items: center;
        }
        .vaghtchin-surface-profile-index .payment-modal-overlay.active {
            display: flex;
        }
        .vaghtchin-surface-profile-index .payment-modal-box {
            background: #fff;
            border-radius: 12px;
            max-width: 700px;
            width: 95%;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 20px 60px rgba(0,0,0,0.3);
            animation: modalFadeIn 0.2s ease-out;
        }
        @keyframes modalFadeIn {
            from { transform: scale(0.95); opacity: 0; }
            to { transform: scale(1); opacity: 1; }
        }
        
        .vaghtchin-surface-profile-index .modal-loader {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(255,255,255,0.8);
            z-index: 10;
            justify-content: center;
            align-items: center;
            border-radius: 12px;
        }
        .vaghtchin-surface-profile-index .modal-loader.active {
            display: flex;
        }
        .vaghtchin-surface-profile-index .modal-loader .spinner {
            width: 50px;
            height: 50px;
            border: 5px solid #e5e7eb;
            border-top-color: #3b82f6;
            border-radius: 50%;
            animation: spin 0.8s linear infinite;
        }
        
        .vaghtchin-surface-profile-index .form-control {
            display: block;
            width: 100%;
            padding: 0.5rem 0.75rem;
            font-size: 0.875rem;
            line-height: 1.5;
            color: #1f2937;
            background-color: #fff;
            border: 1px solid #d1d5db;
            border-radius: 0.375rem;
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        }
        .vaghtchin-surface-profile-index .form-control:focus {
            border-color: #3b82f6;
            outline: 0;
            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
        }
        .vaghtchin-surface-profile-index .form-control[readonly] {
            background-color: #f3f4f6;
            cursor: not-allowed;
        }
        
        .vaghtchin-surface-profile-index .prices-section {
            background: #f8fafc;
            padding: 1rem;
            border-radius: 0.5rem;
            margin-bottom: 1rem;
        }
        
        .vaghtchin-surface-profile-index .btn-primary {
            background-color: #3b82f6;
            color: #fff;
            padding: 0.5rem 1.5rem;
            border: none;
            border-radius: 0.375rem;
            font-weight: 500;
            cursor: pointer;
            transition: background-color 0.15s;
        }
        .vaghtchin-surface-profile-index .btn-primary:hover { background-color: #2563eb; }
        .vaghtchin-surface-profile-index .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
        .vaghtchin-surface-profile-index .btn-secondary {
            background-color: #e5e7eb;
            color: #374151;
            padding: 0.5rem 1.5rem;
            border: none;
            border-radius: 0.375rem;
            font-weight: 500;
            cursor: pointer;
            transition: background-color 0.15s;
        }
        .vaghtchin-surface-profile-index .btn-secondary:hover { background-color: #d1d5db; }
        
        .vaghtchin-surface-profile-index .price-input {
            font-family: 'YekanBakhFaNum', sans-serif !important;
            font-weight: bold !important;
            direction: ltr !important;
            text-align: right !important;
        }
        
        /* ===== Pagination ===== */
        .vaghtchin-surface-profile-index .pagination-link {
            cursor: pointer;
        }
        .vaghtchin-surface-profile-index .pagination-link:hover {
            background-color: #f1f5f9;
        }

        /* ===== Badge animation ===== */
        .vaghtchin-surface-profile-index .badge-count {
            transition: all 0.3s ease;
        }
        .vaghtchin-surface-profile-index .badge-count.update {
            transform: scale(1.2);
        }
        .vaghtchin-surface-profile-index div.visit-form-container:nth-child(1) > div:nth-child(1){
            display: none;
        }
    

/* partials/_layout */

/* Shared panel controls and dialogs. Compiled and scoped by the UI build. */
html.vaghtchin-panel { --panel-control-height: 44px; --panel-control-radius: 8px; }
.vaghtchin-panel input:not(.ts-control input):not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]):not([type=range]):not([type=button]):not([type=submit]), .vaghtchin-panel select, .vaghtchin-panel .ts-control {
    height: var(--panel-control-height) !important;
    min-height: var(--panel-control-height) !important;
    border-radius: var(--panel-control-radius) !important;
    border: 1px solid #e2e8f0 !important;
    padding: 8px var(--panel-input-right, 12px) 8px var(--panel-input-left, 12px) !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    outline: none !important;
    font-size: 14px;
}
.vaghtchin-panel .ts-control { align-items: center; }
.vaghtchin-panel .ts-control input { height: auto !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; }
.vaghtchin-panel .ts-wrapper.multi .ts-control { height: auto !important; }
.vaghtchin-panel textarea { border-radius: var(--panel-control-radius) !important; border: 1px solid #e2e8f0 !important; min-height: 96px; }
.vaghtchin-panel input:focus, .vaghtchin-panel select:focus, .vaghtchin-panel textarea:focus, .vaghtchin-panel button:focus, .vaghtchin-panel a:focus, .vaghtchin-panel [role=button]:focus, .vaghtchin-panel .ts-wrapper.focus .ts-control {
    outline: none !important; box-shadow: none !important; --tw-ring-shadow: 0 0 #0000 !important;
}
.vaghtchin-panel input:focus:not([type=checkbox]):not([type=radio]), .vaghtchin-panel select:focus, .vaghtchin-panel textarea:focus, .vaghtchin-panel .ts-wrapper.focus .ts-control { border-color: #e2e8f0 !important; }
.vaghtchin-panel .dropdown-menu { max-height: calc(100dvh - 32px) !important; overflow-y: auto !important; overscroll-behavior: contain; z-index: 100000 !important; }
.vaghtchin-panel .bkap-dialog-surface, .vaghtchin-panel .payment-modal-box, .vaghtchin-panel .pharmacy-modal-content, .vaghtchin-panel .prescription-modal-content { border-radius: 8px !important; background: #fff; box-shadow: 0 12px 36px #0f172a26 !important; }
.vaghtchin-panel .bkap-dialog-header { display: flex !important; justify-content: space-between !important; align-items: center !important; gap: 12px; padding: 20px !important; margin: 0 !important; border-bottom: 1px solid #e2e8f0 !important; text-align: right; }
.vaghtchin-panel .bkap-dialog-header h2, .vaghtchin-panel .bkap-dialog-header h3 { font-size: 18px !important; font-weight: 500 !important; margin: 0 !important; }
.vaghtchin-panel .bkap-dialog-close { display: inline-flex !important; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0 !important; background: transparent !important; color: #64748b !important; border: 0 !important; box-shadow: none !important; font-size: 26px !important; flex-shrink: 0; }
.vaghtchin-panel .bkap-dialog-close svg { width: 22px; height: 22px; }
.vaghtchin-panel #modalLoader, .vaghtchin-panel #pharmacyModalLoader { display: none !important; }
.vaghtchin-panel .pharmacy-modal-content { padding: 0 !important; }
.vaghtchin-panel #pharmacyForm { padding: 24px; }
@media (max-width: 1279px) {
    .vaghtchin-panel .content { padding-top: 84px !important; }
    .vaghtchin-panel .mobile-header { height: 64px !important; }
    .vaghtchin-panel .mobile-header .mobile-header__menu-button, .vaghtchin-panel #panel-header-actions button { width: 44px !important; height: 44px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; outline: none !important; }
    .vaghtchin-panel .mobile-header .mobile-header__menu-button svg, .vaghtchin-panel #panel-header-actions button svg { width: 26px !important; height: 26px !important; }
    .vaghtchin-panel #panel-header-actions { top: 10px; left: 12px; gap: 0; }
}

.vaghtchin-panel .modal-box { max-width: 800px; max-height: 90dvh; border-radius: 8px !important; }
.vaghtchin-panel .bkap-dialog-surface { padding: 0 !important; }
.vaghtchin-panel .bkap-dialog-surface > form { padding: 24px !important; }
.vaghtchin-panel .bkap-dialog-surface > .bkap-dialog-header:first-child { margin-bottom: 0 !important; }
.vaghtchin-panel .bkap-dialog-surface > .bkap-dialog-header ~ :not(form):not(.modal-loader) { margin-left: 24px; margin-right: 24px; }

.vaghtchin-panel .pharmacy-modal, .vaghtchin-panel .prescription-modal, .vaghtchin-panel .payment-modal-overlay { overflow-y: auto; padding: 20px; }
.vaghtchin-panel .pharmacy-modal-content { max-height: calc(100dvh - 40px); overflow-y: auto; }
.vaghtchin-panel .payment-modal-box > .bkap-dialog-header + div:not(.modal-loader) { margin: 0 !important; padding: 24px !important; }

/* Links and group buttons share one alignment; children share the parent states. */
.vaghtchin-panel .side-menu .side-menu__link { text-align: start !important; justify-content: flex-start !important; gap: 12px !important; }
.vaghtchin-panel .side-menu .side-menu__link__title { text-align: start !important; margin: 0 !important; }
.vaghtchin-panel .side-menu ul.scrollable .side-menu__submenu { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.vaghtchin-panel .side-menu .side-menu__link--active,
.vaghtchin-panel .side-menu .side-menu__link--active:hover {
    color: #fff !important;
    background: linear-gradient(135deg, var(--active-grad-1), var(--active-grad-2)) !important;
    box-shadow: 0 10px 25px -10px rgba(20,184,166,.45), inset 0 0 0 1px rgba(255,255,255,.25) !important;
}
.vaghtchin-panel .side-menu .side-menu__link--active .side-menu__link__title { color: #fff !important; }
.vaghtchin-panel .side-menu .side-menu__link--active .bkap-menu-icon__normal { opacity: 0; }
.vaghtchin-panel .side-menu .side-menu__link--active .bkap-menu-icon__active { opacity: 1; }
.vaghtchin-panel .side-menu .side-menu__submenu .side-menu__link:hover:not(.side-menu__link--active) {
    color: var(--sidebar-text-dark) !important;
    background: var(--glass-bg-hover) !important;
    box-shadow: 0 8px 24px -12px rgba(15,23,42,.20) !important;
    transform: translateY(-1px);
}
/* TomSelect copies native select classes to its wrapper: style only the control. */
.vaghtchin-panel .ts-wrapper { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; height: auto !important; min-height: 0 !important; }
.vaghtchin-panel .ts-wrapper .ts-control { margin: 0 !important; width: 100%; min-height: var(--panel-control-height) !important; height: var(--panel-control-height) !important; display: flex; align-items: center; border: 1px solid #e2e8f0 !important; border-radius: var(--panel-control-radius) !important; padding: 8px 12px !important; box-shadow: none !important; }
.vaghtchin-panel .ts-wrapper.multi .ts-control { height: auto !important; }
.vaghtchin-panel .ts-hidden-accessible { height: 1px !important; min-height: 0 !important; width: 1px !important; padding: 0 !important; border: 0 !important; }

/* Pencil actions retain their icon/color with no filled button, including hover. */
.vaghtchin-panel button[onclick^="edit"], .vaghtchin-panel button[onclick^="openEdit"], .vaghtchin-panel button[title^="ویرایش"], .vaghtchin-panel a[title^="ویرایش"], .vaghtchin-panel .edit-btn, .vaghtchin-panel .edit-medicine-btn, .vaghtchin-panel .edit-prescription-btn, .vaghtchin-panel .edit-patient-btn {
    background: transparent !important; background-image: none !important; box-shadow: none !important;
}
.vaghtchin-panel #status_options_container .status-option-btn,
.vaghtchin-panel #status_options_container .status-option-btn:hover,
.vaghtchin-panel #status_options_container .status-option-btn.active,
.vaghtchin-panel #status_options_container .appointment-status-icon,
.vaghtchin-panel #status_options_container .appointment-status-icon i {
    background: transparent !important; background-image: none !important; box-shadow: none !important;
}
.vaghtchin-panel #status_options_container .status-option-btn.active { border-color: rgb(var(--color-primary)) !important; }
/* The open table menu is placed by Popper within the viewport. */
.vaghtchin-panel .dropdown-menu.show { display: block !important; visibility: visible !important; opacity: 1 !important; }
.vaghtchin-panel button[onclick^="edit"], .vaghtchin-panel button[onclick^="openEdit"], .vaghtchin-panel button[title^="ویرایش"], .vaghtchin-panel a[title^="ویرایش"] { border-color: transparent !important; }

/* Dashboard heading card only; sidebar support retains original typography. */
.vaghtchin-panel .vaghtchin-surface-dashboard .side-menu__support-title { font-size: 16px !important; }
.vaghtchin-panel .vaghtchin-surface-dashboard .side-menu__support-caption { font-size: 14px !important; }

/* rc17: controls retain their semantic geometry after component normalization. */
.vaghtchin-panel .date_button:not(.active_btn) { box-shadow: none !important; }
.vaghtchin-panel .custom-date-range-wrapper .date-item input { padding-right: 38px !important; padding-left: 12px !important; }
.vaghtchin-panel .custom-date-range-wrapper .date-item i { pointer-events: none; }
.vaghtchin-panel #openFilterSlideover svg, .vaghtchin-panel #openFilterSlideoverRevenue svg { color: inherit !important; flex: 0 0 20px; width: 20px; height: 20px; }
@media (min-width: 1280px) {
    .vaghtchin-panel #p24-notification-bell, .vaghtchin-panel #panel-profile-button { width: 52px !important; height: 52px !important; padding: 0 !important; border-radius: 9999px !important; }
    .vaghtchin-panel #p24-notification-bell svg, .vaghtchin-panel #panel-profile-button svg { width: 26px !important; height: 26px !important; }
    .vaghtchin-panel #panel-header-actions { gap: 8px; }
}
.vaghtchin-panel #settingsTabs .tab-card-btn > span:has([data-lucide]), .vaghtchin-panel #settingsTabs .tab-card-btn > span:has(svg) { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.vaghtchin-panel .side-menu__link__icon { background: transparent !important; background-image: none !important; box-shadow: none !important; border: 0 !important; }
.vaghtchin-panel #status_options_container .status-option-btn { background: transparent !important; }
.vaghtchin-panel #status_options_container .status-option-btn > span:not(.appointment-status-icon) { color: inherit; }
/* Single-select input occupies the available line; placeholder and selection do not compete. */
.vaghtchin-panel .ts-wrapper.single .ts-control { flex-wrap: nowrap !important; gap: 6px; }
.vaghtchin-panel .ts-wrapper.single .ts-control > input { min-width: 0 !important; width: auto !important; flex: 1 1 0% !important; margin: 0 !important; text-align: start; }
.vaghtchin-panel .ts-wrapper.single.has-items:not(.focus) .ts-control > input::-moz-placeholder { color: transparent !important; }
.vaghtchin-panel .ts-wrapper.single.has-items:not(.focus) .ts-control > input::placeholder { color: transparent !important; }
/* Every panel dialog uses a neutral, blurred backdrop instead of the theme gradient. */
.vaghtchin-panel .modal, .vaghtchin-panel .payment-modal-overlay, .vaghtchin-panel .pharmacy-modal, .vaghtchin-panel .prescription-modal, .vaghtchin-panel .modal-overlay { background-image: none !important; background-color: rgba(15,23,42,.18) !important; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }


/* Dashboard summary: theme-aware date strip, four metrics and compact status row. */
.vaghtchin-panel #date_buttons { padding: 10px !important; margin: 20px 0 16px !important; border: 1px solid rgb(var(--color-primary)/.12); border-radius: 16px; background: #fff; justify-content: space-between; flex-wrap: wrap; gap: 12px !important; }
.vaghtchin-panel #date_buttons > ul { flex: 1 1 420px; width: auto !important; background: #fff !important; padding: 4px; border-radius: 12px; }
.vaghtchin-panel #date_buttons > ul > li { background: transparent; }
.vaghtchin-panel #date_buttons .date_button { background: transparent !important; border-color: transparent !important; box-shadow: none !important; color: #64748b !important; padding: 10px 12px !important; font-size: 12px; }
.vaghtchin-panel #date_buttons .date_button.active_btn { background: rgb(var(--color-primary)) !important; color: #fff !important; border-color: rgb(var(--color-primary)) !important; }
.vaghtchin-panel #date_buttons .custom-date-range-wrapper { flex: 0 1 290px; float: none !important; margin: 0 !important; gap: 8px !important; }
.vaghtchin-panel #date_buttons .date-item { min-width: 0 !important; }
.vaghtchin-panel #date_buttons .date-item input { font-size: 12px; background: #fff !important; }
.vaghtchin-panel #date_buttons .date-item i { color: rgb(var(--color-primary)/.65); display: flex; }
.vaghtchin-panel #date_buttons .date-separator { display: none; }
.vaghtchin-panel #date_buttons #error_message:not(.show) { display: none; }
.vaghtchin-panel #dashboard-summary-grid { gap: 16px !important; margin-top: 0; }
.vaghtchin-panel #statistic-boxes-area { display:grid!important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; grid-column: 1 / -1 !important; gap: 16px !important; padding: 0 !important;  border-top: none !important; border-bottom: none !important; margin: 0 !important;}
.vaghtchin-panel #statistic-boxes-area > div { grid-column: auto !important; min-width: 0; }
.vaghtchin-panel #statistic-boxes-area .dashboard-metric-card { display: grid !important; grid-template-columns: minmax(0,1fr) 44px; grid-template-rows: 44px auto auto; align-items: center; gap: 12px 8px; min-height: 154px; padding: 20px !important; border: none !important; border-radius: 16px !important; background: #fff; box-shadow: none !important; }
.vaghtchin-panel #statistic-boxes-area .dashboard-metric-label { grid-column: 1; grid-row: 1; color: #64748b; font-size: 13px; min-width: 0; }
.vaghtchin-panel #statistic-boxes-area .box-icon-div { position: static !important; inset: auto !important; grid-column: 2; grid-row: 1; width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 12px !important; box-shadow: none !important; display: flex; align-items: center; justify-content: center; }
.vaghtchin-panel #statistic-boxes-area .box-number-div { grid-column: 1 / -1; grid-row: 2; min-width: 0; padding: 0 !important; margin: 0 !important; font-size: clamp(18px,1.6vw,24px) !important; font-weight: 600; color: #1e293b; text-align: start; overflow-wrap: normal; white-space: nowrap; overflow-x: auto; overflow-y: hidden; max-width: 100%; }
.vaghtchin-panel #statistic-boxes-area .dashboard-metric-caption { grid-column: 1 / -1; grid-row: 3; font-size: 11px; color: #94a3b8; }
.vaghtchin-panel #dashboard-status-summary { gap: 12px; padding: 12px; border-radius: 16px; border: 1px solid rgb(var(--color-primary)/.12); background: #fff; }
.vaghtchin-panel #dashboard-status-title { display: flex; align-items: center; gap: 8px; margin: 0; color: #334155; font-size: 13px; font-weight: 600; }
.vaghtchin-panel #dashboard-status-title svg { color: rgb(var(--color-primary)/.65); flex-shrink: 0; }
.vaghtchin-panel .dashboard-status-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; min-width: 0; }
.vaghtchin-panel .dashboard-status-item { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: center; gap: 8px; min-width: 0; min-height: 48px; padding: 10px 12px; border-radius: 12px; background: #f8fafc; }
.vaghtchin-panel .dashboard-status-icon { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 14px; }
.vaghtchin-panel .dashboard-status-label { color: #64748b; font-size: 11px; overflow-wrap: anywhere; }
.vaghtchin-panel .dashboard-status-value { color: #1e293b; font-weight: 600; font-size: 13px; overflow-wrap: anywhere; }
.vaghtchin-panel .dashboard-status-change { grid-column: 2 / -1; font-size: 10px; }
@media (min-width: 1024px) {
    .vaghtchin-panel #statistic-boxes-area { grid-template-columns: repeat(4,minmax(0,1fr)) !important;  border-top: none !important; border-bottom: none !important; margin: 0 !important;}
    .vaghtchin-panel #dashboard-status-summary { grid-template-columns: 130px minmax(0,1fr); align-items: center; }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-item { padding: 8px; gap: 6px; }
}
@media (max-width: 639px) {
    .vaghtchin-panel #date_buttons > ul, .vaghtchin-panel #date_buttons .custom-date-range-wrapper { flex-basis: 100%; }
    .vaghtchin-panel #date_buttons .custom-date-range-wrapper { flex-direction: row !important; }
    .vaghtchin-panel #date_buttons .date-item { width: auto !important; }
    .vaghtchin-panel #statistic-boxes-area { gap: 10px !important; }
    .vaghtchin-panel #statistic-boxes-area .dashboard-metric-card { padding: 14px !important; grid-template-columns: minmax(0,1fr) 36px; }
    .vaghtchin-panel #statistic-boxes-area .box-icon-div { width: 36px !important; height: 36px !important; }
}
/* Match the reference proportions without stretching the preset group. */
.vaghtchin-panel #date_buttons { background: #fff !important; border: 1px solid rgb(var(--color-primary)/.1) !important; padding: 8px !important; min-height: 64px; box-shadow: none !important; }
.vaghtchin-panel #date_buttons > ul { flex: 0 1 496px !important; width: 496px !important; max-width: 100%; background: #fff !important; border-radius: 12px !important; padding: 4px !important; gap: 0 !important; }
.vaghtchin-panel #date_buttons > ul > li { flex: 1 1 0; min-width: 0; background: transparent !important; }
.vaghtchin-panel #date_buttons .date_button { height: 40px; padding: 8px 10px !important; border-radius: 8px !important; font-size: 12px !important; }
.vaghtchin-panel #date_buttons .custom-date-range-wrapper { flex: 0 0 288px; max-width: 100%; }
.vaghtchin-panel #date_buttons .date-item input { padding-right: 36px !important; padding-left: 12px !important; height: 44px !important; text-align: right !important; }
.vaghtchin-panel #date_buttons .date-item i { right: 12px !important; left: auto !important; }
.vaghtchin-panel #statistic-boxes-area .dashboard-metric-card { border: none !important; box-shadow: none !important; }
.vaghtchin-panel #dashboard-status-summary { border: 1px solid rgb(var(--color-primary)/.1) !important; }
.vaghtchin-panel #dashboard-status-title svg { display: block; width: 16px !important; height: 16px !important; }
@media (min-width: 1024px) {
    .vaghtchin-panel #dashboard-status-summary { grid-template-columns: 140px minmax(0,1fr); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid--1 { grid-template-columns: minmax(0,1fr); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid--3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid--4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .vaghtchin-panel #dashboard-status-summary .dashboard-status-grid--5 { grid-template-columns: repeat(6,minmax(0,1fr)); }
}
@media (max-width: 639px) {
    .vaghtchin-panel #date_buttons > ul { flex: 1 1 100% !important; width: 100% !important; display: flex; flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; gap: 4px !important; }
    .vaghtchin-panel #date_buttons .custom-date-range-wrapper { flex: 1 1 100%; }
    .vaghtchin-panel #date_buttons .date_button { padding: 8px 4px !important; }
}
@media (max-width: 639px) {
    .vaghtchin-panel #date_buttons ul[role="tablist"] { flex-wrap: nowrap !important; background: #fff !important; }
    .vaghtchin-panel #date_buttons ul[role="tablist"] li { background: transparent !important; }
}


.vaghtchin-panel .dashboard-status-item { color: inherit; text-decoration: none; transition: background-color .15s; }
.vaghtchin-panel .dashboard-status-item:hover { background: #ecfdf5; }
.vaghtchin-panel .dashboard-status-item:focus-visible { outline: 2px solid #11aa92; outline-offset: 3px; }

/* login */
/* Standalone staff login; shared panel/sidebar rules do not apply here. */
.vaghtchin-login input:not([type=checkbox]):not([type=hidden]) { height: 44px !important; min-height: 44px; width: 100%; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; padding: 8px 12px; box-shadow: none !important; }
.vaghtchin-login input:focus, .vaghtchin-login button:focus, .vaghtchin-login a:focus { outline: none !important; box-shadow: none !important; }
.vaghtchin-login input:focus { border-color: #e2e8f0 !important; }
.vaghtchin-login #staff-password-form button[type=submit], .vaghtchin-login #staff-otp-submit { display: flex; align-items: center; justify-content: center; width: 100%; height: 48px; background: rgb(var(--color-primary)); color: #fff; border: 0; border-radius: 8px; }
.vaghtchin-login [data-login-tab] { border: 0; box-shadow: none; background: transparent; }
.vaghtchin-login [data-login-tab][aria-pressed=true] { background: #fff; color: rgb(var(--color-primary)); }
.vaghtchin-login [data-slide-go] { padding: 0; border: 0; background: transparent; box-shadow: none; }

/* partials/_layout */
/* Approved shared table presentation. Scoped by the template UI build. */
.vaghtchin-panel .bkap-table-tools { padding: 0 !important; border: 0 !important; background: transparent; gap: 8px; margin: 0; flex-wrap: nowrap !important; flex-shrink: 0; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-icon, .vaghtchin-panel .bkap-filter-clear {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    width: 42px !important; min-width: 42px !important; height: 42px !important;
    padding: 0 !important; border: 1px solid #e2e8f0 !important; border-radius: 9px !important;
    background: #fff !important; color: #64748b; box-shadow: none !important;
}
.vaghtchin-panel .bkap-table-tools .bkap-tool-icon svg { width: 19px; height: 19px; margin: 0; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-icon:hover { background: #f8fafc !important; border-color: #cbd5e1 !important; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-excel { color: #19865b !important; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-excel:hover { background: #f0fdf4 !important; border-color: #bbf7d0 !important; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-pdf { color: #d05252 !important; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-pdf:hover { background: #fff5f5 !important; border-color: #fecaca !important; }
.vaghtchin-panel .bkap-table-tools .bkap-tool-columns { color: #7161b6 !important; margin-inline-start: 6px; }
.vaghtchin-panel .bkap-tool-icon::after {
    content: attr(data-tooltip); position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%);
    border-radius: 6px; background: #263249; color: #fff; padding: 5px 9px; font-size: 11px;
    line-height: 1.6; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; z-index: 30;
}
.vaghtchin-panel .bkap-tool-icon:hover::after, .vaghtchin-panel .bkap-tool-icon:focus-visible::after { opacity: 1; visibility: visible; }
.vaghtchin-panel .bkap-tool-icon:focus-visible, .vaghtchin-panel .bkap-filter-clear:focus-visible { outline: 2px solid #c4b5fd !important; outline-offset: 3px; }
.vaghtchin-panel .bkap-filter-clear { color: #df4444 !important; background: #fff5f5 !important; border-color: #fbd5d5 !important; margin-inline-start: auto; }
.vaghtchin-panel .bkap-filter-clear.hidden { display: none !important; }
.vaghtchin-panel .bkap-filter-clear:hover { background: #feecec !important; border-color: #f5a9a9 !important; }
.vaghtchin-panel .bkap-card-table { border-collapse: collapse; }
.vaghtchin-panel .bkap-card-table > thead > tr > th { background: #fff; color: #64748b; font-size: 12px; font-weight: 400; border-top: 0; border-bottom: 1px solid #e5eaf0; }
.vaghtchin-panel .bkap-card-table > tbody > tr > td { border-bottom: 1px solid #eef2f6; padding: 17px 12px; }
.vaghtchin-panel .bkap-card-table > tbody > tr { border-bottom: 0; }
.vaghtchin-panel .bkap-card-table > tbody > tr:hover { background: #fafbff; }
@media (min-width: 768px) {
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-primary { display: table-cell !important; width: auto !important; margin: 0 !important; }
}
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-scroll { overflow: visible !important; min-width: 0; height: auto; max-height: none; }
    .vaghtchin-panel .bkap-card-table, .vaghtchin-panel .bkap-card-table > tbody { display: block; width: 100%; min-width: 0 !important; }
    .vaghtchin-panel .bkap-card-table > thead { display: block; padding: 10px 2px; }
    .vaghtchin-panel .bkap-card-table > thead > tr { display: block; }
    .vaghtchin-panel .bkap-card-table > thead > tr > th { display: none; border: 0; padding: 0; }
    .vaghtchin-panel .bkap-card-table > thead > tr > th.bkap-card-bulk { display: flex; align-items: center; gap: 8px; color: #94a3b8; font-size: 11px; width: auto; }
    .vaghtchin-panel .bkap-card-bulk::after { content: 'انتخاب همهٔ ردیف‌ها'; }
    .vaghtchin-panel .bkap-card-table > tbody > tr:not(.bkap-table__empty-row) {
        display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px 16px;
        position: relative; margin: 0 0 12px; padding: 17px 16px; border: 1px solid #e5eaf2;
        border-radius: 13px; background: #fff; overflow: visible; direction: inherit; box-shadow: 0 2px 6px #18243c03;
    }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td, .vaghtchin-panel .bkap-card-table .bkap-row-expanded td:not(.bkap-card-primary):not(.bkap-card-select) {
        display: block !important; min-width: 0; width: auto !important; padding: 0 !important;
        border: 0 !important; white-space: normal !important; overflow-wrap: anywhere; text-align: start !important;
    }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td::before {
        display: block !important; content: attr(data-label) !important; color: #94a3b8;
        font-size: 10px; font-weight: 400; margin-bottom: 5px;
    }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-heading {
        grid-column: 1/-1; grid-row: 1; padding-inline-start: 28px !important; padding-bottom: 14px !important;
        border-bottom: 1px solid #f0f3f7 !important; font-weight: 500;
    }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-heading::before, .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-select::before, .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-actions::before, .vaghtchin-panel .bkap-card-table > tbody > tr > td[colspan]::before { display: none !important; content: none !important; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-primary { justify-content: initial; gap: 0; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-identifier { grid-column: 1/-1; order: 2; border-top: 1px solid #f0f3f7 !important; padding-top: 10px !important; font-size: 10px !important; color: #94a3b8; display: flex !important; justify-content: space-between; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-identifier::before { margin: 0; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-select { display: block !important; position: absolute; inset-inline-start: 16px; top: 17px; padding: 0 !important; width: 16px !important; }
    .vaghtchin-panel .bkap-card-table input[type=checkbox] { display: inline-block !important; width: 15px; height: 15px; margin: 0; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-actions { grid-column: 1/-1; order: 3; display: flex !important; justify-content: flex-end; border-top: 1px solid #f0f3f7 !important; padding-top: 12px !important; overflow: visible; }
    .vaghtchin-panel .bkap-card-actions > div { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-customer > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-customer > div > div:last-child { text-align: end; }
    .vaghtchin-panel .bkap-card-table > tbody > tr:has(input:checked) { border-color: #b7a6e0; box-shadow: 0 0 0 1px #e9e1fb; background: #fefcff; }
    .vaghtchin-panel .bkap-card-table > tbody > tr.bkap-table__empty-row, .vaghtchin-panel .bkap-card-table > tbody > tr:has(td[colspan]) { display: block; padding: 0; border: 0; background: transparent; box-shadow: none; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td[colspan] { display: block !important; grid-column: 1/-1; padding: 24px 12px !important; text-align: center !important; }
    .vaghtchin-panel .bkap-card-table .bkap-row-toggle { display: none !important; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-column-hidden.bkap-column-hidden { display: none !important; }
}

.vaghtchin-panel .bkap-table-search { --panel-input-left: 38px; --panel-input-right: 12px; }
/* Search uses physical left placement in the RTL panel, including its text inset. */
.vaghtchin-panel .bkap-table-search > [data-lucide="search"] {
    left: 12px !important; right: auto !important; top: 50% !important; bottom: auto !important;
    margin: 0 !important; transform: translateY(-50%); pointer-events: none;
}
.vaghtchin-panel .bkap-table-search > input { padding-left: 38px !important; padding-right: 12px !important; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-actions button[onclick*="openStatusModal"] { width: 32px; height: 32px; padding: 4px !important; flex-shrink: 0; justify-content: center; border-radius: 8px; }
}

/* Column chooser spacing is independent of the shared modal header reset. */
.vaghtchin-panel .bkap-columns-modal [data-column-options] { padding: 20px 24px; margin: 0; }
.vaghtchin-panel .bkap-columns-modal [data-column-footer] { padding: 0 24px 20px; margin: 0; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-columns-modal [data-column-options] { padding: 20px; }
    .vaghtchin-panel .bkap-columns-modal [data-column-footer] { padding: 0 20px 20px; }
}

/* Shared list header: the same search width and icon tools on every list. */
.vaghtchin-panel [data-bkap-table-header] { display: flex; flex-direction: row !important; align-items: center; flex-wrap: wrap; gap: 12px; padding: 20px !important; margin-bottom: 0 !important; }
.vaghtchin-panel [data-bkap-table-header] > .bkap-table-tools { margin-inline-start: auto; }
.vaghtchin-panel .bkap-table-search { width: 320px; max-width: 100%; min-width: 0; flex: 0 1 320px !important; }
.vaghtchin-panel .bkap-table-search > input { width: 100% !important; }
.vaghtchin-panel [data-bkap-table-header] > .flex-1 { flex: 0 1 auto !important; min-width: 0; }
.vaghtchin-panel .bkap-export-scope { position: relative; }
.vaghtchin-panel .bkap-export-menu { position: absolute; top: calc(100% + 8px); inset-inline-end: 0; width: 260px; max-width: calc(100vw - 40px); padding: 6px; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; box-shadow: 0 10px 24px #0f172a14; z-index: 40; }
.vaghtchin-panel .bkap-export-menu[hidden] { display: none !important; }
.vaghtchin-panel .bkap-export-menu button { width: 100%; display: block; border: 0 !important; background: #fff !important; padding: 10px !important; margin: 0; text-align: start; font-size: 12px; font-weight: 400; box-shadow: none !important; }
.vaghtchin-panel .bkap-export-menu button:hover { background: #f8fafc !important; }
.vaghtchin-panel .bkap-export-menu svg { display: none; }
@media (max-width: 767px) {
    .vaghtchin-panel [data-bkap-table-header] { padding: 16px !important; }
    .vaghtchin-panel .bkap-table-search { width: 100%; flex-basis: 100% !important; }
    .vaghtchin-panel [data-bkap-table-header] > .flex-1 { width: 100%; }
}

.vaghtchin-panel [data-bkap-table-filters] > select, .vaghtchin-panel [data-bkap-table-filters] > .ts-wrapper { width: 250px; max-width: 100%; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-table .bkap-card-checkbox { position: absolute; inset-inline-start: 16px; top: 17px; }
    .vaghtchin-panel [data-bkap-table-filters] > select, .vaghtchin-panel [data-bkap-table-filters] > .ts-wrapper { width: 100%; }
}

@media (min-width: 768px) {
    .vaghtchin-panel [data-manual-table-filter] { display: none !important; }
    .vaghtchin-panel .bkap-table-filter-actions:has(.bkap-filter-clear.hidden) { display: none; }
}
@media (min-width: 1280px) {
    .vaghtchin-panel .bkap-auto-filter-fields { display: flex !important; gap: 12px; align-items: flex-end; }
    .vaghtchin-panel .bkap-auto-filter-fields > div { flex: 1 1 0; min-width: 0; }
    .vaghtchin-panel .bkap-auto-filter-fields > .bkap-table-filter-actions { flex: 0 0 auto; }
}

.vaghtchin-panel .bkap-prescription-filters > label { min-width: 0; color: #64748b; font-size: 12px; }
.vaghtchin-panel .bkap-date-field { --panel-input-left: 40px; }
.vaghtchin-panel .bkap-date-field .bkap-date-clear { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0 !important; margin: 0; border: 0 !important; background: transparent !important; color: #94a3b8; box-shadow: none !important; }
.vaghtchin-panel .bkap-date-field .bkap-date-clear:hover { color: #dc4444; }
.vaghtchin-panel .bkap-prescription-filters > .bkap-filter-clear { align-self: end; }

.vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-payment-actions { text-align: center !important; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-payment-actions { justify-content: center !important; }
}
@media (min-width: 1280px) {
    .vaghtchin-panel .bkap-prescription-filters:has(> .bkap-filter-clear:not(.hidden)) { grid-template-columns: repeat(4,minmax(0,1fr)) auto; }
}

/* Continuous desktop separators and a shared selection-column geometry. */
@media (min-width: 768px) {
    .vaghtchin-panel .bkap-card-table > tbody > tr:not(.bkap-table__empty-row) { border-bottom: 1px solid #eef2f6 !important; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-primary.font-mono { border-bottom: 1px solid #eef2f6 !important; }
    .vaghtchin-panel .bkap-card-table > thead > tr > th.bkap-card-bulk,
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-select {
        width: 44px !important; min-width: 44px !important; padding: 16px 12px !important;
        text-align: center !important; vertical-align: middle;
    }
    .vaghtchin-panel .bkap-card-table > thead > tr > th.bkap-card-bulk input[type=checkbox],
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-select input[type=checkbox] {
        display: inline-block; width: 16px; height: 16px; margin: 0; padding: 0; vertical-align: middle;
    }
}
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-table > thead { padding-inline: 17px; }
}

/* Patient source labels fit their text and sit below the centered identifier. */
.vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-patient-identity { text-align: center !important; }
.vaghtchin-panel .bkap-patient-identity .bkap-source-badge { display: inline-flex; align-items: center; justify-content: center; width: auto !important; min-width: 0 !important; max-width: 100%; margin: 8px auto 0 !important; padding: 5px 8px !important; line-height: 1.4 !important; white-space: nowrap; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-patient-identity { align-items: center; flex-wrap: wrap; -moz-column-gap: 10px; column-gap: 10px; row-gap: 8px; }
    .vaghtchin-panel .bkap-patient-identity .bkap-source-badge { margin: 0 !important; }
}

.vaghtchin-panel .bkap-card-disclosure { display: none; }
@media (max-width: 767px) {
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-heading { position: relative; padding-inline-end: 30px !important; }
    .vaghtchin-panel .bkap-card-disclosure { display: inline-flex; align-items: center; justify-content: center; position: absolute; inset-inline-end: 0; top: 0; width: 28px; height: 28px; padding: 0 !important; border: 0 !important; background: transparent !important; color: #64748b; box-shadow: none !important; }
    .vaghtchin-panel .bkap-card-disclosure:focus-visible { outline: 2px solid rgb(var(--color-primary)); outline-offset: 2px; }
    .vaghtchin-panel .bkap-card-disclosure svg { transition: transform .2s; }
    .vaghtchin-panel .bkap-card-open .bkap-card-disclosure svg { transform: rotate(180deg); }
    .vaghtchin-panel .bkap-card-table > tbody > tr:not(.bkap-card-open) > td:not(.bkap-card-heading):not(.bkap-card-select):not(.bkap-card-status):not(.bkap-card-actions) { display: none !important; }
    .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-status { grid-column: 1/-1; }
    .vaghtchin-panel .bkap-card-table > tbody > tr:not(.bkap-card-open) > td.bkap-card-heading { padding-bottom: 0 !important; border-bottom: 0 !important; }
}
.vaghtchin-panel .bkap-patient-visit-filters { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
.vaghtchin-panel .bkap-patient-visit-filters label { display: flex; flex-direction: column; gap: 6px; width: 150px; font-size: 12px; color: #64748b; }
.vaghtchin-panel .bkap-patient-visit-filters label:first-child { width: 220px; }
.vaghtchin-panel .bkap-patient-visit-filters label[hidden] { display: none !important; }
@media (max-width: 767px) { .vaghtchin-panel .bkap-patient-visit-filters, .vaghtchin-panel .bkap-patient-visit-filters label, .vaghtchin-panel .bkap-patient-visit-filters label:first-child { width: 100%; } }
@media (max-width: 767px) { .vaghtchin-panel .bkap-card-table > tbody > tr > td.bkap-card-select { z-index: 2; } }

/* partials/_layout */
/* Approved prescription form, shared by the pharmacy page and reservation tab. */
.vaghtchin-panel .rx-presentation { min-width: 0; color: #23364a; }
.vaghtchin-panel .rx-presentation #cg { display: grid; grid-template-columns: minmax(280px,.85fr) minmax(0,1.5fr); gap: 20px; align-items: stretch; }
.vaghtchin-panel .rx-presentation .rx-panel { min-width: 0; background: #fff; border: 1px solid #e3eaef; border-radius: 14px; overflow: visible; box-shadow: none; }
.vaghtchin-panel .rx-presentation .rx-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; border-bottom: 1px solid #edf1f4; }
.vaghtchin-panel .rx-heading { display: flex; align-items: center; gap: 10px; min-width: 0; }
.vaghtchin-panel .rx-heading h2 { font-size: 16px; font-weight: 700; margin: 0; }
.vaghtchin-panel .rx-step { display: grid; place-items: center; width: 29px; height: 29px; flex-shrink: 0; border-radius: 8px; background: rgb(var(--color-primary)/.08); color: rgb(var(--color-primary)); font-size: 12px; font-weight: 700; }
.vaghtchin-panel .rx-presentation .rx-panel-body { padding: 20px; }
.vaghtchin-panel .rx-caption { font-size: 12px; color: #8290a0; line-height: 1.9; }
.vaghtchin-panel .rx-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 12px; width: 100%; margin: 18px 0 0; }
.vaghtchin-panel .rx-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 12px; color: #53677b; margin-bottom: 16px; }
.vaghtchin-panel .rx-field-wide { grid-column: 1/-1; }
.vaghtchin-panel .rx-field input, .vaghtchin-panel .rx-field select, .vaghtchin-panel .rx-field textarea, .vaghtchin-panel .rx-field .ts-wrapper { width: 100% !important; min-width: 0; margin: 0 !important; }
.vaghtchin-panel .rx-field input, .vaghtchin-panel .rx-field select, .vaghtchin-panel .rx-field textarea { min-height: 42px; border: 1px solid #dce5eb; border-radius: 8px; padding: 10px 12px; background: #fff; color: #263d52; }
.vaghtchin-panel .rx-field .ts-control { min-height: 42px; border: 1px solid #dce5eb; border-radius: 8px; padding: 10px 12px; box-shadow: none; }
.vaghtchin-panel .rx-field input:focus, .vaghtchin-panel .rx-field select:focus, .vaghtchin-panel .rx-field textarea:focus { border-color: rgb(var(--color-primary)); box-shadow: 0 0 0 3px rgb(var(--color-primary)/.08); }
.vaghtchin-panel .rx-field input[type=number], .vaghtchin-panel .item-qty-input { -webkit-appearance: textfield; appearance: textfield; -moz-appearance: textfield; }
.vaghtchin-panel .rx-field input[type=number]::-webkit-inner-spin-button, .vaghtchin-panel .rx-field input[type=number]::-webkit-outer-spin-button, .vaghtchin-panel .item-qty-input::-webkit-inner-spin-button, .vaghtchin-panel .item-qty-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.vaghtchin-panel .rx-presentation #selectedMedicineInfo { padding: 0; margin: 16px 0 0; background: transparent; border: 0; }
.vaghtchin-panel .rx-presentation #selectedMedicineInfo:not(.show) { display: none; }
.vaghtchin-panel .rx-drug-preview { padding: 13px; display: flex; align-items: center; gap: 10px; background: #f4faf8; border: 1px solid #e1efe9; border-radius: 9px; }
.vaghtchin-panel .rx-drug-preview strong { font-size: 13px; min-width: 0; overflow-wrap: anywhere; }
.vaghtchin-panel .rx-drug-icon { display: grid; place-items: center; width: 35px; height: 35px; flex-shrink: 0; background: #e1f1eb; color: #159d84; border-radius: 8px; }
.vaghtchin-panel .rx-drug-preview .info-value { margin-inline-start: auto; color: #14927d; font-size: 11px; border-radius: 6px; padding: 4px 8px; background: #e0f3ea; flex-shrink: 0; }
.vaghtchin-panel .rx-drug-preview .stock-danger { background: #fff0f0; color: #d34d54; }
.vaghtchin-panel .rx-presentation #addToListBtn, .vaghtchin-panel .rx-presentation #clearSelectionBtn { width: 100%; min-height: 42px; border-radius: 9px; }
.vaghtchin-panel .rx-count { flex-shrink: 0; color: #128f7e; background: #e7f5ef; border-radius: 20px; font-size: 11px; padding: 5px 11px; }
.vaghtchin-panel .rx-presentation #selectedMedicinesList { margin: 0; padding: 0; border: 0; border-radius: 0; max-height: none; overflow: visible; }
.vaghtchin-panel .rx-presentation .selected-medicine-item { padding: 18px 20px; border-bottom: 1px solid #edf1f4; }
.vaghtchin-panel .rx-presentation .selected-medicine-item:last-child { border-bottom: 0; }
.vaghtchin-panel .rx-item-top { display: flex; align-items: center; gap: 10px; }
.vaghtchin-panel .rx-item-number { width: 25px; height: 25px; flex-shrink: 0; display: grid; place-items: center; color: #8092a3; background: #f1f5f8; border-radius: 6px; font-size: 11px; }
.vaghtchin-panel .rx-item-top .item-name { min-width: 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.vaghtchin-panel .rx-item-actions { display: flex; gap: 4px; margin-inline-start: auto; flex-shrink: 0; }
.vaghtchin-panel .rx-icon-button { border: 0; background: transparent; box-shadow: none; color: #91a0ae; padding: 7px !important; min-width: 34px; min-height: 34px; border-radius: 7px; }
.vaghtchin-panel .rx-icon-button span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.vaghtchin-panel .rx-icon-button:hover { background: #f1f5f8; color: rgb(var(--color-primary)); }
.vaghtchin-panel .rx-icon-button.item-remove:hover { background: #fff0f0; color: #d34d54; }
.vaghtchin-panel .rx-item-instructions { margin: 10px 35px 11px 0; font-size: 12px; line-height: 1.9; color: #72869a; overflow-wrap: anywhere; }
.vaghtchin-panel .rx-item-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-inline-start: 35px; }
.vaghtchin-panel .rx-chip { background: #f4f7fa; color: #73869a; border-radius: 6px; font-size: 11px; padding: 4px 9px; }
.vaghtchin-panel .rx-list-note { display: flex; align-items: center; gap: 8px; color: #8798a8; font-size: 12px; line-height: 1.9; padding: 15px 20px; border-block: 1px solid #edf1f4; background: #fbfcfd; }
.vaghtchin-panel .rx-presentation #doctorNotes, .vaghtchin-panel #editMedicalModal #editDoctorNotes { min-height: 82px; height: 82px; resize: vertical; }
.vaghtchin-panel .rx-draft-footer { display: flex; align-items: center; gap: 10px; padding-top: 16px; border-top: 1px solid #edf1f4; }
.vaghtchin-panel .rx-draft-footer .rx-caption { margin-inline-end: auto; }
.vaghtchin-panel .rx-submit { min-height: 40px; border-radius: 9px; white-space: nowrap; }
.vaghtchin-panel .rx-archive { margin-top: 24px; }
.vaghtchin-panel .rx-archive-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.vaghtchin-panel .rx-archive-heading h2 { font-size: 15px; }
.vaghtchin-panel .rx-presentation #medicalListContainer { max-height: 600px; overflow-y: auto; padding: 0 2px; }
.vaghtchin-panel .rx-presentation #medicalList { display: grid; grid-template-columns: 1fr; gap: 12px; }
.vaghtchin-panel .rx-presentation .medical-card { margin: 0; background: #fff; border: 1px solid #e3eaef; border-radius: 12px; padding: 0; box-shadow: none; min-width: 0; }
.vaghtchin-panel .rx-presentation .medical-card summary { display: flex; align-items: center; gap: 12px; list-style: none; padding: 17px 20px; cursor: pointer; }
.vaghtchin-panel .rx-presentation .medical-card summary::-webkit-details-marker { display: none; }
.vaghtchin-panel .rx-presentation .medical-card summary:focus-visible { outline: 2px solid rgb(var(--color-primary)); outline-offset: 2px; border-radius: 12px; }
.vaghtchin-panel .rx-presentation .medical-number { color: #23364a; font-size: 13px; font-weight: 700; white-space: nowrap; }
.vaghtchin-panel .rx-presentation .medical-date, .vaghtchin-panel .rx-archive-item-count { color: #8899aa; font-size: 12px; }
.vaghtchin-panel .rx-medical-status { margin-inline-start: auto; border-radius: 6px; font-size: 11px; padding: 4px 9px; flex-shrink: 0; background: #e7f5ed; color: #14927d; }
.vaghtchin-panel .rx-medical-status--completed { background: #eff6ff; color: #4f7fa8; }
.vaghtchin-panel .rx-medical-status--canceled { background: #fff0f0; color: #c25965; }
.vaghtchin-panel .rx-archive-chevron { width: 16px; height: 16px; flex-shrink: 0; color: #8297a8; transition: transform .2s; }
.vaghtchin-panel .rx-presentation .medical-card[open] .rx-archive-chevron { transform: rotate(180deg); }
.vaghtchin-panel .rx-medical-detail { border-top: 1px solid #edf1f4; padding: 16px 20px; }
.vaghtchin-panel .rx-presentation .medicine-item { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid #edf1f4; }
.vaghtchin-panel .rx-presentation .medicine-item:last-child { border-bottom: 0; }
.vaghtchin-panel .rx-medicine-quantity { flex-shrink: 0; color: #8290a0; font-size: 12px; }
.vaghtchin-panel .rx-presentation .medical-doctor-notes { margin: 12px 0; padding: 12px; background: #f8fafb; border-radius: 8px; color: #708398; font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.vaghtchin-panel .rx-presentation .medical-card-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; border-top: 1px solid #edf1f4; padding-top: 14px; margin-top: 8px; }
.vaghtchin-panel .rx-empty { padding: 40px 20px; text-align: center; color: #899baa; font-size: 13px; }
.vaghtchin-panel .rx-patient-summary { display: flex; align-items: center; gap: 12px; padding: 17px 20px; background: white; border: 1px solid #e5ecef; border-radius: 14px; margin-bottom: 22px; }
.vaghtchin-panel .rx-patient-avatar { display: grid; place-items: center; width: 46px; height: 46px; flex-shrink: 0; color: rgb(var(--color-primary)); background: rgb(var(--color-primary)/.08); border-radius: 50%; }
.vaghtchin-panel .rx-patient-summary strong { font-size: 15px; }
.vaghtchin-panel .rx-patient-doctor { margin-inline-start: auto; font-size: 12px; color: #6a7e90; }
.vaghtchin-panel #editMedicalModal[data-rx-presentation] { z-index: 9999; }
.vaghtchin-panel #editMedicalModal[data-rx-presentation] > div { max-width: 650px; border-radius: 14px; margin-bottom: 32px; }
.vaghtchin-panel #editMedicalModal[data-rx-presentation] > div > div { padding: 24px !important; }
.vaghtchin-panel #editMedicalModal[data-rx-presentation] #editMedicalItems { max-height: min(50vh,460px); overflow-y: auto; margin: 20px 0; padding: 0 2px; }
.vaghtchin-panel .rx-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid #edf1f4; }
.vaghtchin-panel .rx-modal-footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 18px; margin-top: 18px; border-top: 1px solid #edf1f4; }
.vaghtchin-panel .rx-edit-item { border: 1px solid #e3eaef; background: #fff; padding: 16px; border-radius: 10px; margin-bottom: 14px; }
.vaghtchin-panel .rx-drug-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; }
.vaghtchin-panel .rx-drug-heading .item-stock { font-size: 11px; color: #94a3b8; }
@media (max-width: 900px) { .vaghtchin-panel .rx-presentation #cg { grid-template-columns: 1fr; } }
@media (max-width: 639px) { .vaghtchin-panel .rx-presentation .rx-panel-body { padding: 18px; } .vaghtchin-panel .rx-presentation .rx-panel-header { padding: 18px; } .vaghtchin-panel .rx-fields { gap: 0 12px; } .vaghtchin-panel .rx-draft-footer { flex-wrap: wrap; } .vaghtchin-panel .rx-draft-footer .rx-caption { width: 100%; margin-bottom: 4px; } .vaghtchin-panel .rx-item-instructions { margin-inline-start: 0; } .vaghtchin-panel .rx-item-chips { margin-inline-start: 0; } .vaghtchin-panel .rx-presentation .medical-card summary { padding: 15px; gap: 8px; } .vaghtchin-panel .rx-presentation .medical-date { display: none; } .vaghtchin-panel .rx-archive-item-count { font-size: 11px; } .vaghtchin-panel .rx-patient-doctor { display: none; } .vaghtchin-panel #editMedicalModal[data-rx-presentation] > div > div { padding: 20px !important; } }

.vaghtchin-panel #confirmDeleteModal[aria-modal=true] { z-index: 10000; }

/* partials/_layout */
.vaghtchin-panel .bkap-year-heatmap { width: 100%; overflow-x: auto; direction: rtl; }
.vaghtchin-panel .bkap-heatmap-canvas { display: flex; direction: rtl; align-items: flex-start; width: -moz-max-content; width: max-content; min-width: 970px; height: 190px; }
.vaghtchin-panel .bkap-heatmap-month { position: relative; flex: 0 0 auto; padding-top: 30px; }
.vaghtchin-panel .bkap-heatmap-month > svg { display: block; max-width: none; }
.vaghtchin-panel .bkap-heatmap-month-name { position: absolute; top: 0; inset-inline: 0; height: 30px; display: flex; align-items: center; justify-content: center; }
.vaghtchin-panel .bkap-heatmap-month-name, .vaghtchin-panel .bkap-heatmap-weekdays { font-family: 'YekanBakhFaNum', sans-serif; font-size: 12px; font-weight: 400; color: #334155; direction: rtl; unicode-bidi: isolate; letter-spacing: normal; word-spacing: normal; white-space: nowrap; }
.vaghtchin-panel .bkap-heatmap-weekdays { flex: 0 0 70px; display: grid; grid-template-rows: repeat(7,15px); padding-top: 30px; padding-inline: 5px; }
.vaghtchin-panel .bkap-heatmap-weekdays > span { line-height: 15px; text-align: start; }
.vaghtchin-panel .bkap-heatmap-weekdays > span:nth-child(1) { grid-row: 1; }
.vaghtchin-panel .bkap-heatmap-weekdays > span:nth-child(2) { grid-row: 3; }
.vaghtchin-panel .bkap-heatmap-weekdays > span:nth-child(3) { grid-row: 5; }
.vaghtchin-panel .bkap-heatmap-weekdays > span:nth-child(4) { grid-row: 7; }

/* partials/_layout */
.vaghtchin-panel .bkap-messaging label { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 12px; color: #64748b; }
.vaghtchin-panel .bkap-message-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.vaghtchin-panel .bkap-message-grid-four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.vaghtchin-panel .bkap-messaging input, .vaghtchin-panel .bkap-messaging select, .vaghtchin-panel .bkap-messaging textarea, .vaghtchin-panel .bkap-messaging .ts-wrapper { width: 100%; min-width: 0; }
.vaghtchin-panel .bkap-messaging textarea { resize: vertical; min-height: 110px; }
.vaghtchin-panel .bkap-message-context { border: 1px solid #e5edf1; border-radius: 8px; padding: 12px; line-height: 1.9; }
.vaghtchin-panel .bkap-message-group-list { max-height: 340px; overflow: auto; margin-top: 14px; }
.vaghtchin-panel .bkap-message-group-list label { flex-direction: row; align-items: center; gap: 10px; border-bottom: 1px solid #edf1f5; padding: 12px 4px; color: #334155; }
.vaghtchin-panel .bkap-message-group-list input[type=checkbox] { width: 16px; height: 16px; flex-shrink: 0; }
.vaghtchin-panel .bkap-message-preview-panel { border-top: 1px solid #edf1f5; padding-top: 20px; }
.vaghtchin-panel .bkap-message-preview-item { border: 1px solid #e5edf1; padding: 16px; border-radius: 10px; margin-bottom: 12px; }
.vaghtchin-panel .bkap-message-preview-item h3 { font-size: 13px; margin-bottom: 12px; }
.vaghtchin-panel .bkap-message-preview-item textarea { width: 100%; min-height: 140px; }
.vaghtchin-panel .bkap-archived-message { max-width: 320px; max-height: 78px; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.9; font-size: 12px; }
.vaghtchin-panel .bkap-message-variable { font-size: 11px !important; padding: 5px 8px !important; }
.vaghtchin-panel .bkap-messaging [hidden] { display: none !important; }
.vaghtchin-panel .bkap-message-modal-body { white-space: pre-wrap; overflow-wrap: anywhere; padding: 20px 24px; line-height: 2; max-height: 70vh; overflow-y: auto; }
@media(max-width:767px) { .vaghtchin-panel .bkap-message-grid, .vaghtchin-panel .bkap-message-grid-four { grid-template-columns: 1fr; } .vaghtchin-panel .bkap-archived-message { max-width: none; } }