/*
 * Admin theme — white + blue (light), navy + blue (dark).
 *
 * Metronic apne rang CSS variables se leta hai, is liye yahan sirf variables badle hain:
 * har page ke buttons, badges, links, sidebar aur header khud naye rang me aa jate hain.
 * Rang badalna ho to sirf neeche ke do blocks (light / dark) me --adm-* variables.
 * Page ke apne styles: pages.css. Dashboard: dashboard.css.
 */

/* ---------------- Rang: light ---------------- */
:root,
[data-bs-theme="light"] {
    --adm-blue: #2563eb;
    --adm-blue-hover: #1d4ed8;
    --adm-blue-soft: #eef4ff;
    --adm-blue-rgb: 37, 99, 235;
    --adm-bg: #f4f7fc;
    --adm-card: #ffffff;
    --adm-line: #e6eaf2;
    --adm-soft: #f7f9fd;
    --adm-text: #0f1b3d;
    --adm-muted: #6b7591;
    --adm-sidebar: #0e2463;
    --adm-sidebar-2: #0a1b4d;
    --adm-shadow: 0 1px 2px rgba(15, 27, 61, .04), 0 4px 16px -8px rgba(15, 27, 61, .08);

    --bs-primary: var(--adm-blue);
    --bs-primary-rgb: var(--adm-blue-rgb);
    --bs-primary-active: var(--adm-blue-hover);
    --bs-primary-light: var(--adm-blue-soft);
    --bs-primary-clarity: rgba(37, 99, 235, .2);
    --bs-primary-inverse: #ffffff;
    --bs-text-primary: var(--adm-blue);
    --bs-primary-text-emphasis: var(--adm-blue-hover);
    --bs-primary-bg-subtle: var(--adm-blue-soft);
    --bs-primary-border-subtle: #c7d7fb;
    --bs-link-color: var(--adm-blue);
    --bs-link-color-rgb: var(--adm-blue-rgb);
    --bs-link-hover-color: var(--adm-blue-hover);
    --bs-component-active-bg: var(--adm-blue);

    --bs-app-bg-color: var(--adm-bg);
    --bs-app-blank-bg-color: var(--adm-bg);
    --adm-header: #ffffff;
    --bs-app-header-base-bg-color: var(--adm-header);
    --bs-app-header-sticky-bg-color: var(--adm-header);
    --bs-app-header-base-border-bottom: 1px solid var(--adm-line);
    --bs-app-header-sticky-border-bottom: 1px solid var(--adm-line);
    --bs-app-sidebar-base-bg-color: var(--adm-sidebar);

    /* Metronic ka "info" jamni hai — blue theme me aasmani neela */
    --bs-info: #0ea5e9;
    --bs-info-rgb: 14, 165, 233;
    --bs-info-active: #0284c7;
    --bs-info-light: #e0f2fe;
    --bs-info-clarity: rgba(14, 165, 233, .2);
    --bs-info-inverse: #ffffff;
    --bs-text-info: #0284c7;
}

/* ---------------- Rang: dark (navy + blue) ---------------- */
[data-bs-theme="dark"] {
    --adm-blue: #3b82f6;
    --adm-blue-hover: #60a5fa;
    --adm-blue-soft: #13244a;
    --adm-blue-rgb: 59, 130, 246;
    --adm-bg: #080d18;
    --adm-card: #0f1626;
    --adm-line: #1c2638;
    --adm-soft: #131c2e;
    --adm-text: #e6ebf5;
    --adm-muted: #8a94ad;
    --adm-sidebar: #0b1220;
    --adm-sidebar-2: #0b1220;
    --adm-shadow: 0 1px 2px rgba(0, 0, 0, .3);

    --bs-primary: var(--adm-blue);
    --bs-primary-rgb: var(--adm-blue-rgb);
    --bs-primary-active: var(--adm-blue-hover);
    --bs-primary-light: var(--adm-blue-soft);
    --bs-primary-clarity: rgba(59, 130, 246, .25);
    --bs-primary-inverse: #ffffff;
    --bs-text-primary: var(--adm-blue-hover);
    --bs-link-color: var(--adm-blue-hover);
    --bs-link-color-rgb: 96, 165, 250;
    --bs-link-hover-color: #93c5fd;
    --bs-component-active-bg: var(--adm-blue);

    --bs-body-bg: var(--adm-card);
    --bs-body-bg-rgb: 15, 22, 38;
    --bs-card-bg: var(--adm-card);
    --bs-border-color: var(--adm-line);
    --bs-gray-100: var(--adm-soft);
    --bs-gray-200: #1a2438;
    --bs-gray-300: #26324a;
    --bs-app-bg-color: var(--adm-bg);
    --bs-app-blank-bg-color: var(--adm-bg);
    --adm-header: #0b1220;
    --bs-app-header-base-bg-color: var(--adm-header);
    --bs-app-header-sticky-bg-color: var(--adm-header);
    --bs-app-header-base-border-bottom: 1px solid var(--adm-line);
    --bs-app-header-sticky-border-bottom: 1px solid var(--adm-line);
    --bs-app-sidebar-base-bg-color: var(--adm-sidebar);

    --bs-info: #38bdf8;
    --bs-info-rgb: 56, 189, 248;
    --bs-info-active: #7dd3fc;
    --bs-info-light: #0c2a3d;
    --bs-info-clarity: rgba(56, 189, 248, .25);
    --bs-info-inverse: #0b1220;
    --bs-text-info: #7dd3fc;
}

/* ---------------- Base ---------------- */
body.app-default {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    background-color: var(--adm-bg);
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
}
.app-default h1, .app-default h2, .app-default h3, .app-default h4, .app-default h5, .app-default h6,
.app-default .card-title, .app-default .menu-title {
    font-family: "Inter", system-ui, sans-serif;
    letter-spacing: -.01em;
}
.app-default .fs-2x.fw-bold, .app-default .mono { font-variant-numeric: tabular-nums; }
::selection { background: rgba(var(--adm-blue-rgb), .2); }

/* ---------------- Sidebar (dono modes me gehra neela/navy — safed logo saaf dikhe) ---------------- */
#kt_app_sidebar {
    background: linear-gradient(180deg, var(--adm-sidebar) 0%, var(--adm-sidebar-2) 100%) !important;
    border-right: 1px solid rgba(255, 255, 255, .04);
}
[data-bs-theme="dark"] #kt_app_sidebar { border-right-color: var(--adm-line); }
#kt_app_sidebar_header { padding: 26px 24px 22px !important; border-bottom: 1px solid rgba(255, 255, 255, .07); margin-bottom: 14px; }
#kt_app_sidebar_header img { height: 42px !important; width: auto; max-width: 180px; object-fit: contain; }
#kt_app_sidebar .app-sidebar-navs-default { padding-left: 14px !important; padding-right: 14px !important; }
#kt_app_sidebar .separator { display: none; }
#kt_app_sidebar .menu-heading {
    display: block;
    color: rgba(255, 255, 255, .42) !important;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 20px 12px 6px;
}
#kt_app_sidebar .menu-item .menu-content { padding: 0; }
#kt_app_sidebar .menu-item { padding: 1px 0; }
#kt_app_sidebar .menu-link {
    color: rgba(255, 255, 255, .74) !important;
    padding: 8px 12px !important;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 500;
    transition: background-color .15s ease, color .15s ease;
}
#kt_app_sidebar .menu-link .menu-title { color: inherit !important; display: flex; align-items: center; }
#kt_app_sidebar .menu-link .menu-title > i {
    width: 20px;
    flex-shrink: 0;
    margin: 0 12px 0 0 !important;
    text-align: center;
    font-size: 14px;
    color: rgba(255, 255, 255, .5);
    transition: color .15s;
}
#kt_app_sidebar .menu-link:hover { background-color: rgba(255, 255, 255, .06) !important; color: #fff !important; }
#kt_app_sidebar .menu-link:hover .menu-title > i { color: #fff; }
#kt_app_sidebar .menu-item.show > .menu-link { color: #fff !important; background-color: rgba(255, 255, 255, .05) !important; }
#kt_app_sidebar .menu-item.show > .menu-link .menu-title > i { color: #93c5fd; }

/* Active: soft tint + thin left marker, same idea in light and dark */
#kt_app_sidebar .menu-link.active {
    background-color: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
    font-weight: 600;
    box-shadow: inset 2px 0 0 #60a5fa;
}
#kt_app_sidebar .menu-link.active .menu-title > i { color: #93c5fd; }
[data-bs-theme="dark"] #kt_app_sidebar .menu-link.active { background-color: rgba(59, 130, 246, .16) !important; }

#kt_app_sidebar .menu-arrow::after { background-color: rgba(255, 255, 255, .45) !important; }
#kt_app_sidebar .menu-item.show > .menu-link .menu-arrow::after { background-color: #fff !important; }

/* Sub menu: ek baareek line ke sath, taake nesting samajh aaye */
#kt_app_sidebar .menu-sub-accordion { margin-left: 21px; padding-left: 10px; border-left: 1px solid rgba(255, 255, 255, .1); }
#kt_app_sidebar .menu-sub .menu-link { font-size: 13.5px; padding: 7px 10px !important; color: rgba(255, 255, 255, .62) !important; }
#kt_app_sidebar .menu-sub .menu-link:hover { color: #fff !important; }
#kt_app_sidebar .menu-sub .menu-link.active { background-color: rgba(255, 255, 255, .08) !important; color: #fff !important; box-shadow: none; }
[data-bs-theme="dark"] #kt_app_sidebar .menu-sub .menu-link.active { background-color: rgba(59, 130, 246, .18) !important; }
#kt_app_sidebar .menu-sub .menu-bullet { width: 14px; margin-right: 6px; }
#kt_app_sidebar .bullet.bullet-dot { background-color: rgba(255, 255, 255, .3) !important; width: 5px; height: 5px; }
#kt_app_sidebar .menu-link.active .bullet.bullet-dot { background-color: #60a5fa !important; transform: scale(1.3); }
#kt_app_sidebar_menu_wrapper::-webkit-scrollbar-thumb, #kt_app_sidebar .hover-scroll-y::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, .15) !important; }

/* Sidebar: logo upar, menu beech me scroll, "Visit website" hamesha neeche */
#kt_app_sidebar { display: flex; flex-direction: column; }
/* Phones/tablets: keep the menu hidden until Metronic turns it into a slide-in drawer (.drawer).
   Without this, the display:flex above showed the full menu on every page load, then it slid away. */
@media (max-width: 991.98px) {
    #kt_app_sidebar:not(.drawer) { display: none !important; }
}
#kt_app_sidebar .adm-side-body { flex: 1 1 auto; min-height: 0; position: relative; }
#kt_app_sidebar .adm-side-scroll { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .18) transparent; }
#kt_app_sidebar .adm-side-scroll::-webkit-scrollbar { width: 6px; }
#kt_app_sidebar .adm-side-scroll::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .18); border-radius: 6px; }
#kt_app_sidebar_footer { flex-shrink: 0; }

/* Menu ginti (pending payments / open tickets) */
#kt_app_sidebar .menu-link { display: flex; align-items: center; }
.adm-menu-badge { margin-left: auto; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 99px; background: #f59e0b; color: #1f1300; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }

/* ---------------- Sidebar: collapse button, close button, collapsed mode (sidebar.js) ---------------- */
.adm-side-logo { display: inline-flex; align-items: center; }
#kt_app_sidebar_header { position: relative; }
#kt_app_sidebar_header img.adm-logo-mini { display: none; width: 36px; height: 36px !important; max-width: none; border-radius: 9px; object-fit: contain; }

/* Round button on the sidebar edge: chevron left = collapse, right = expand */
.adm-sidebar-toggle {
    display: none;
    position: absolute; top: 50%; right: -14px; transform: translateY(-50%); z-index: 5;
    width: 28px; height: 28px; border-radius: 50%; padding: 0;
    align-items: center; justify-content: center;
    background: var(--adm-card); color: var(--adm-muted);
    border: 1px solid var(--adm-line); box-shadow: 0 4px 12px -4px rgba(15, 27, 61, .35);
    cursor: pointer; transition: color .15s, border-color .15s, background-color .15s;
}
.adm-sidebar-toggle i { font-size: 11px; transition: transform .2s ease; }
.adm-sidebar-toggle:hover, .adm-sidebar-toggle:focus-visible { color: var(--adm-blue); border-color: rgba(var(--adm-blue-rgb), .45); }
html.adm-mini .adm-sidebar-toggle i { transform: rotate(180deg); }

/* Phones: logo + close (X) at the top of the slide-in menu */
.adm-side-mobile-head { padding: 16px 16px 14px 20px; border-bottom: 1px solid rgba(255, 255, 255, .07); margin-bottom: 12px; }
.adm-side-mobile-head img { height: 34px; width: auto; max-width: 160px; object-fit: contain; }
.adm-side-close {
    width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .06); color: #fff; font-size: 16px;
    transition: background-color .15s;
}
.adm-side-close:hover, .adm-side-close:focus-visible { background: rgba(255, 255, 255, .16); }

@media (min-width: 992px) {
    .adm-sidebar-toggle { display: inline-flex; }
    /* The button sits half outside the sidebar */
    #kt_app_sidebar { overflow: visible; transition: width .2s ease; z-index: 1055; }

    /* Collapsed: header, content and footer follow this width (Metronic layout variable) */
    html.adm-mini body { --bs-app-sidebar-width: 76px; }

    html.adm-mini #kt_app_sidebar_header { padding: 22px 0 18px !important; }
    html.adm-mini #kt_app_sidebar .adm-logo-full { display: none; }
    html.adm-mini #kt_app_sidebar img.adm-logo-mini { display: block; }
    html.adm-mini #kt_app_sidebar .app-sidebar-navs-default { padding-left: 12px !important; padding-right: 12px !important; }

    /* Group headings become thin dividers */
    html.adm-mini #kt_app_sidebar .menu-item > .menu-content { display: none; }
    html.adm-mini #kt_app_sidebar .menu-item:has(> .menu-content) { height: 1px; margin: 10px 8px; padding: 0; background: rgba(255, 255, 255, .1); }

    /* Icons only, centred; the name shows as a tooltip (title) */
    html.adm-mini #kt_app_sidebar .menu-link { position: relative; justify-content: center; padding: 11px 0 !important; }
    html.adm-mini #kt_app_sidebar .menu-link .menu-title { font-size: 0 !important; justify-content: center; }
    html.adm-mini #kt_app_sidebar .menu-link .menu-title > i { margin: 0 !important; font-size: 16px; }
    html.adm-mini #kt_app_sidebar .menu-arrow,
    html.adm-mini #kt_app_sidebar .menu-sub { display: none !important; }
    /* Count badge becomes a dot on the icon */
    html.adm-mini #kt_app_sidebar .adm-menu-badge { position: absolute; top: 6px; right: 12px; min-width: 9px; width: 9px; height: 9px; padding: 0; font-size: 0; border: 2px solid var(--adm-sidebar); }

    html.adm-mini #kt_app_sidebar .adm-side-foot { padding: 12px; }
    html.adm-mini #kt_app_sidebar .adm-side-foot a { justify-content: center; padding: 10px 0; }
    html.adm-mini #kt_app_sidebar .adm-side-foot-text,
    html.adm-mini #kt_app_sidebar .adm-side-foot .adm-go { display: none; }
}
/* Sidebar footer */
.adm-side-foot { padding: 14px; border-top: 1px solid rgba(255, 255, 255, .07); }
.adm-side-foot a { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 8px; color: rgba(255, 255, 255, .78); font-size: 13.5px; font-weight: 500; background: rgba(255, 255, 255, .05); transition: background-color .15s, color .15s; }
.adm-side-foot a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.adm-side-foot a i { width: 20px; text-align: center; color: #93c5fd; }
.adm-side-foot a .adm-go { margin-left: auto; font-size: 11px; opacity: .6; }

/* ---------------- Header ---------------- */
/* Header ka rang thos (blur/backdrop-filter nahi — us se header alag layer banta tha aur popups page ke neeche chhup jate the).
   z-index page content se upar taake notifications / user menu hamesha samne khulen. */
#kt_app_header { position: sticky; top: 0; z-index: 1050; background-color: var(--adm-header) !important; border-bottom: 1px solid var(--adm-line); }
/* Mobile: side menu (drawer) aur us ka dhundla parda header se bhi upar — warna header menu ke upar ke items chhupa deta */
#kt_app_sidebar.drawer { z-index: 1070 !important; }
.drawer-overlay { z-index: 1065 !important; background-color: rgba(8, 13, 24, .45) !important; }

/* Header popups ki chaurai (pehle ghalat classes w-260px / w-325px -> menu poori screen par phail jata tha) */
.menu-sub-dropdown.adm-drop-user { width: 270px; max-width: calc(100vw - 24px); }
.menu-sub-dropdown.adm-drop-notes { width: 380px; max-width: calc(100vw - 24px); }
/* Header popups fori aur poore dikhen — Metronic ki fade/move animation beech me atak kar popup ko dhundla chhod deti thi */
#kt_app_header .menu-sub-dropdown.show { animation: none !important; opacity: 1 !important; transform-origin: top right; }
#kt_app_header .menu-sub-dropdown { background-color: var(--adm-card) !important; }
.app-page-title h1 { font-size: 18px !important; font-weight: 600 !important; color: var(--adm-text) !important; letter-spacing: -.02em; }
.app-page-title .breadcrumb { margin: 2px 0 0 !important; }
.app-page-title .breadcrumb-item, .app-page-title .breadcrumb-item a { color: var(--adm-muted) !important; font-weight: 400 !important; font-size: 12px; }
.app-page-title .breadcrumb-item a:hover { color: var(--adm-blue) !important; }
.adm-icon-btn {
    width: 36px; height: 36px; border-radius: 8px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--adm-card); border: 1px solid var(--adm-line); color: var(--adm-muted);
    position: relative; cursor: pointer; transition: color .15s, border-color .15s, background-color .15s;
}
.adm-icon-btn:hover { color: var(--adm-text); border-color: var(--adm-muted); }
.adm-icon-btn:focus-visible { outline: 2px solid var(--adm-blue); outline-offset: 2px; }
.adm-icon-btn i { font-size: 14px; line-height: 1; }
.adm-icon-btn .adm-count { position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px; background: #ef4444; color: #fff; font-size: 10.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--adm-card); }
.adm-user { display: flex; align-items: center; gap: 10px; padding: 4px 8px 4px 4px; border-radius: 8px; cursor: pointer; transition: background-color .15s; }
.adm-user:hover { background: var(--adm-soft); }
.adm-avatar { width: 32px; height: 32px; border-radius: 8px; background: var(--adm-blue); color: #fff; font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; }
.adm-avatar { position: relative; }
.adm-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.adm-user-name { font-size: 13px; font-weight: 600; color: var(--adm-text); line-height: 1.2; }
.adm-user-role { font-size: 11.5px; color: var(--adm-muted); }
.adm-user .fa-chevron-down { font-size: 10px; color: var(--adm-muted); }
/* Mobile header me safed logo halki jagah par dikhe */
[data-bs-theme="light"] #kt_app_header .adm-mobile-logo img { filter: invert(1) hue-rotate(180deg); }
.adm-mobile-logo img { height: 34px; width: auto; }

/* Dropdowns (notifications / user menu) */
.app-default .menu-sub-dropdown { border-radius: 10px !important; border: 1px solid var(--adm-line); box-shadow: 0 20px 50px -20px rgba(15, 27, 61, .35) !important; }
.adm-drop-head { padding: 16px 20px 12px; border-bottom: 1px solid var(--adm-line); display: flex; justify-content: space-between; align-items: center; }
.adm-drop-head h4 { font-size: 15px; font-weight: 700; margin: 0; color: var(--adm-text); }
.adm-drop-head span { font-size: 12px; color: var(--adm-muted); }
.adm-note { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px dashed var(--adm-line); }
.adm-note:last-child { border-bottom: 0; }
.adm-note-icon { width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.adm-note-danger { background: rgba(239, 68, 68, .1); color: #ef4444; }
.adm-note-warning { background: rgba(245, 158, 11, .12); color: #d97706; }
.adm-note-info { background: var(--adm-blue-soft); color: var(--adm-blue); }
.adm-note-text { font-size: 13px; color: var(--adm-text); line-height: 1.45; }
.adm-note-time { font-size: 11.5px; color: var(--adm-muted); margin-top: 2px; }

/* ---------------- Content spacing ----------------
   Metronic sets .app-content padding to 0 (its demo has a toolbar there). Without it every
   page's first card touched the header line, and on phones the page title sat under the header. */
.app-default #kt_app_content { padding-top: 24px !important; padding-bottom: 32px !important; }
#kt_app_content_container > .app-page-title { margin-bottom: 18px !important; }
@media (max-width: 991.98px) {
    .app-default #kt_app_content { padding-top: 18px !important; padding-bottom: 24px !important; }
}

/* Wrapper added by responsive-tables.js: invisible to layout on desktop, used only on phones */
#kt_app_content .adm-stack-val { display: contents; }
@media (max-width: 767.98px) { #kt_app_content table.adm-stack .adm-stack-val { display: block; } }

/* ---------------- Tables on phones ----------------
   responsive-tables.js labels every cell and adds .adm-stack; each row then shows as a card:
   first cell = title, other cells = "Label  value", last cell = actions. */
@media (max-width: 767.98px) {
    #kt_app_content table.adm-stack thead { display: none; }
    #kt_app_content table.adm-stack,
    #kt_app_content table.adm-stack > tbody,
    #kt_app_content table.adm-stack > tbody > tr,
    #kt_app_content table.adm-stack > tbody > tr > td { display: block; width: 100%; }
    #kt_app_content table.adm-stack > tbody > tr {
        border: 1px solid var(--adm-line) !important; border-radius: 12px;
        padding: 12px 14px; margin: 0 0 12px; background: var(--adm-card);
    }
    #kt_app_content table.adm-stack > tbody > tr:first-child { margin-top: 4px; }
    #kt_app_content table.adm-stack > tbody > tr > td {
        display: flex; justify-content: space-between; align-items: center; gap: 12px;
        padding: 6px 0 !important; border: 0 !important; text-align: right; min-width: 0; overflow-wrap: anywhere;
    }
    #kt_app_content table.adm-stack > tbody > tr > td::before {
        content: attr(data-label); flex-shrink: 0; max-width: 45%;
        font-size: 12px; font-weight: 600; color: var(--adm-muted); text-align: left;
    }
    #kt_app_content table.adm-stack > tbody > tr > td[data-label=""]::before { content: none; }
    #kt_app_content table.adm-stack > tbody > tr > td:first-child {
        display: block; text-align: left; font-weight: 600; padding-bottom: 10px !important;
        margin-bottom: 4px; border-bottom: 1px dashed var(--adm-line) !important;
    }
    #kt_app_content table.adm-stack > tbody > tr > td:first-child::before { content: none; }
    #kt_app_content table.adm-stack > tbody > tr > td:last-child:not(:first-child) {
        justify-content: flex-end; flex-wrap: wrap; padding-top: 10px !important;
    }
    #kt_app_content table.adm-stack > tbody > tr > td:last-child:not(:first-child)::before { content: none; }
    #kt_app_content table.adm-stack > tbody > tr > td.adm-stack-full { display: block; text-align: center; }
    #kt_app_content table.adm-stack > tbody > tr > td.adm-stack-full::before { content: none; }
    #kt_app_content table.adm-stack > tbody > tr:hover { background: var(--adm-card) !important; }
    #kt_app_content table.adm-stack > tbody > tr > td:first-child { justify-content: flex-start !important; gap: 12px; }
    #kt_app_content table.adm-stack > tbody > tr > td:first-child > .adm-stack-val { display: flex; align-items: center; gap: 12px; min-width: 0; }
    #kt_app_content table.adm-stack .adm-stack-val { min-width: 0; text-align: right; }
    #kt_app_content table.adm-stack > tbody > tr > td:first-child .adm-stack-val,
    #kt_app_content table.adm-stack > tbody > tr > td:last-child .adm-stack-val { text-align: left; }
    #kt_app_content table.adm-stack > tbody > tr > td:last-child:not(:first-child) > .adm-stack-val { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
    #kt_app_content table.adm-stack > tbody > tr.adm-row-attn { border-left: 3px solid #ef4444 !important; }
    #kt_app_content table.adm-stack > tbody > tr.adm-row-attn > td:first-child { box-shadow: none; }
}

/* ---------------- Content: cards ---------------- */
.app-default #kt_app_content .card {
    border: 1px solid var(--adm-line);
    border-radius: 14px;
    box-shadow: var(--adm-shadow);
    background-color: var(--adm-card);
}
.app-default #kt_app_content .card > .card-header { border-bottom: 1px solid var(--adm-line); min-height: 64px; padding: 16px 24px; }
.app-default #kt_app_content .card > .card-header .card-title,
.app-default #kt_app_content .card > .card-header h3,
.app-default #kt_app_content .card > .card-header h2 { font-size: 17px !important; font-weight: 700 !important; color: var(--adm-text); }
.app-default #kt_app_content .card > .card-body { padding: 22px 24px; }
.app-default #kt_app_content .card > .card-footer { border-top: 1px solid var(--adm-line); background: transparent; }

/* ---------------- Tables ---------------- */
.app-default #kt_app_content .table > thead > tr > th,
.app-default #kt_app_content .table > thead > tr > td {
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--adm-muted) !important;
    white-space: nowrap;
}
.app-default #kt_app_content .table:not(.db-table) > thead { background: var(--adm-soft); }
.app-default #kt_app_content .table:not(.db-table) > thead > tr > th:first-child { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.app-default #kt_app_content .table:not(.db-table) > thead > tr > th:last-child { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.app-default #kt_app_content .table > thead > tr > th:first-child { padding-left: 14px; }
.app-default #kt_app_content .table > tbody > tr { transition: background-color .12s; }
.app-default #kt_app_content .table:not(.db-table) > tbody > tr:hover { background-color: rgba(var(--adm-blue-rgb), .035); }
.app-default #kt_app_content .table > tbody > tr > td:first-child { padding-left: 14px; }
.app-default #kt_app_content .table > tbody > tr > td { color: var(--bs-gray-800); }
.app-default #kt_app_content .table.table-row-dashed > tbody > tr { border-bottom-color: var(--adm-line); }

/* ---------------- Forms ---------------- */
.app-default .form-control, .app-default .form-select {
    border-radius: 10px;
    border-color: var(--adm-line);
    font-size: 14px;
    transition: border-color .15s, box-shadow .15s;
}
.app-default .form-control:focus, .app-default .form-select:focus {
    border-color: rgba(var(--adm-blue-rgb), .6) !important;
    box-shadow: 0 0 0 4px rgba(var(--adm-blue-rgb), .12) !important;
}
.app-default .form-control.form-control-solid, .app-default .form-select.form-select-solid { background-color: var(--adm-soft); border-color: var(--adm-soft); }
.app-default .form-label, .app-default label.required, .app-default .col-form-label { font-weight: 600; color: var(--adm-text); font-size: 13.5px; }
.app-default .form-check-input { border: 1px solid rgba(var(--adm-blue-rgb), .45); }
.app-default .form-check-input:checked { background-color: var(--adm-blue); border-color: var(--adm-blue); }
.app-default .form-check-label { color: var(--adm-text); }

/* ---------------- Buttons ---------------- */
.app-default .btn { border-radius: 10px; font-weight: 600; }
.app-default .btn.btn-sm { border-radius: 8px; }
.app-default .btn.btn-primary { box-shadow: 0 6px 14px -8px rgba(var(--adm-blue-rgb), .9); }
.app-default .btn.btn-primary:hover:not(.btn-active) { transform: translateY(-1px); }
.app-default .btn { transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s, transform .15s; }

/* Table row actions (components/button-*.blade.php): halke, ek jaise, shor nahi */
.app-default .btn.adm-act {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 11px !important; font-size: 12.5px; font-weight: 600;
    border: 1px solid transparent; border-radius: 8px; box-shadow: none; margin-right: 4px;
}
.app-default .btn.adm-act i { font-size: 12px; padding: 0; }
.app-default .btn.adm-act:hover { transform: none; }
.adm-act-view { background: var(--adm-soft) !important; color: var(--bs-gray-700) !important; border-color: var(--adm-line) !important; }
.adm-act-view:hover { color: var(--adm-blue) !important; border-color: rgba(var(--adm-blue-rgb), .35) !important; }
.adm-act-edit { background: rgba(var(--adm-blue-rgb), .1) !important; color: var(--adm-blue) !important; }
.adm-act-edit:hover { background: var(--adm-blue) !important; color: #fff !important; }
.adm-act-delete { background: rgba(239, 68, 68, .1) !important; color: #dc2626 !important; }
.adm-act-delete:hover { background: #dc2626 !important; color: #fff !important; }
.adm-act-wa { background: rgba(34, 197, 94, .12) !important; color: #16a34a !important; }
.adm-act-wa:hover { background: #16a34a !important; color: #fff !important; }
.adm-act-wa i { font-size: 15px !important; }
[data-bs-theme="dark"] .adm-act-delete { color: #f87171 !important; }
[data-bs-theme="dark"] .adm-act-wa { color: #4ade80 !important; }

/* List pages ka card header: <h1>Title</h1> + "Showing x to y" */
.app-default #kt_app_content .card > .card-header h1 { font-size: 18px; font-weight: 700; margin: 0 0 2px; color: var(--adm-text); letter-spacing: -.01em; }
.app-default #kt_app_content .card > .card-header .pagination-details p,
.app-default #kt_app_content .card > .card-header > div > p { font-size: 13px; color: var(--adm-muted); margin: 0; }
.app-default #kt_app_content .pagination-details p { color: var(--adm-muted); font-size: 13px; }

/* Orders page ke filter (All / Pending / Completed ...) — chips jaisa, ginti andar */
.buttons-div { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px !important; }
.buttons-div .btn {
    margin: 0 !important; display: inline-flex; align-items: center; gap: 8px;
    background: var(--adm-card) !important; color: var(--bs-gray-700) !important;
    border: 1px solid var(--adm-line) !important; box-shadow: none !important;
    padding: 7px 12px !important; font-size: 13px; font-weight: 600; border-radius: 999px;
}
.buttons-div .btn:hover { border-color: rgba(var(--adm-blue-rgb), .45) !important; color: var(--adm-blue) !important; transform: none !important; }
.buttons-div .btn .badge {
    position: static !important; top: auto !important; right: auto !important;
    background: var(--adm-soft) !important; color: var(--adm-muted) !important;
    font-size: 11.5px; padding: 3px 8px; min-width: 24px;
}
.buttons-div .btn.adm-on { background: var(--adm-blue) !important; border-color: var(--adm-blue) !important; color: #fff !important; }
.buttons-div .btn.adm-on .badge { background: rgba(255, 255, 255, .22) !important; color: #fff !important; }

/* ---------------- Badges ---------------- */
.app-default .badge { border-radius: 999px; font-weight: 600; padding: .4em .75em; }
/* Solid status badges (safed text peele par parhna mushkil) -> halke tinted chips */
.app-default #kt_app_content .badge.badge-success { background: rgba(34, 197, 94, .12); color: #15803d; }
.app-default #kt_app_content .badge.badge-warning { background: rgba(245, 158, 11, .15); color: #b45309; }
.app-default #kt_app_content .badge.badge-danger { background: rgba(239, 68, 68, .12); color: #dc2626; }
.app-default #kt_app_content .badge.badge-info { background: rgba(14, 165, 233, .12); color: #0284c7; }
.app-default #kt_app_content .badge.badge-primary { background: rgba(var(--adm-blue-rgb), .1); color: var(--adm-blue); }
.app-default #kt_app_content .badge.badge-secondary { background: var(--adm-soft); color: var(--bs-gray-700); border: 1px solid var(--adm-line); }
[data-bs-theme="dark"] #kt_app_content .badge.badge-success { color: #4ade80; }
[data-bs-theme="dark"] #kt_app_content .badge.badge-warning { color: #fbbf24; }
[data-bs-theme="dark"] #kt_app_content .badge.badge-danger { color: #f87171; }
[data-bs-theme="dark"] #kt_app_content .badge.badge-info { color: #7dd3fc; }
[data-bs-theme="dark"] #kt_app_content .badge.badge-primary { color: #93c5fd; }

/* ---------------- Pagination ---------------- */
.app-default .pagination .page-item .page-link { border-radius: 9px; font-weight: 600; }
.app-default .pagination .page-item.active .page-link { background-color: var(--adm-blue); box-shadow: 0 6px 14px -8px rgba(var(--adm-blue-rgb), .9); }

/* ---------------- Modals & alerts ---------------- */
.app-default .modal-content { border-radius: 16px; border: 1px solid var(--adm-line); }
.app-default .modal-header { border-bottom-color: var(--adm-line); }
.app-default .modal-footer { border-top-color: var(--adm-line); }
.app-default .alert { border-radius: 12px; }

/* ---------------- Footer ---------------- */
#kt_app_footer { border-top: 1px solid var(--adm-line); }
.adm-foot { font-size: 12.5px; color: var(--adm-muted); }
.adm-foot a { color: var(--adm-muted); font-weight: 500; }
.adm-foot a:hover { color: var(--adm-blue); }

/* ---------------- Login / forgot password (layout/auth.blade.php) ---------------- */
body.adm-auth-body { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; background: var(--adm-auth-bg); }
:root { --adm-auth-bg: #fafbfc; --adm-auth-input: #ffffff; --adm-auth-border: #cdd3de; }
[data-bs-theme="dark"] { --adm-auth-bg: var(--adm-bg); --adm-auth-input: var(--adm-card); --adm-auth-border: #2b3650; }
.adm-auth { display: grid; grid-template-columns: minmax(360px, 40%) minmax(0, 1fr); min-height: 100vh; }

/* Left: brand panel — sidebar navy, one soft light source, nothing else */
.adm-auth-side {
    color: #fff; padding: 44px 56px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
    background: radial-gradient(90% 55% at 0% 0%, rgba(59, 130, 246, .16), transparent 70%), var(--adm-sidebar);
}
[data-bs-theme="dark"] .adm-auth-side { border-right: 1px solid var(--adm-line); }
.adm-auth-logo { display: inline-flex; align-items: center; }
.adm-auth-logo img { height: 48px; width: auto; max-width: 220px; object-fit: contain; }
.adm-auth-logo span { font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -.01em; }
.adm-auth-side h2 { color: #fff; font-size: 28px; font-weight: 600; line-height: 1.25; letter-spacing: -.015em; margin: 0 0 10px; }
.adm-auth-lead { color: rgba(255, 255, 255, .72); font-size: 15px; line-height: 1.6; max-width: 360px; margin: 0; }
.adm-auth-list { list-style: none; padding: 0; margin: 36px 0 0; max-width: 360px; }
.adm-auth-list li { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 14px; }
.adm-auth-list li:last-child { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.adm-auth-list b { font-weight: 500; color: #fff; }
.adm-auth-list span { color: rgba(255, 255, 255, .6); text-align: right; }
.adm-auth-foot { font-size: 13px; color: rgba(255, 255, 255, .55); }

/* Right: the form sits on the page, no floating card */
.adm-auth-main { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; background: var(--adm-auth-bg); }
.adm-auth-box { width: 100%; max-width: 380px; }
.adm-auth-after { margin-top: 40px; font-size: 13px; }
.adm-auth-after a { color: var(--adm-muted); font-weight: 500; }
.adm-auth-after a:hover { color: var(--adm-text); }
/* Older views still wrapped in .card (package expired) — no box inside the page */
.adm-auth-box .card { border: 0; box-shadow: none; background: transparent; }
.adm-auth-box .card-body { padding: 0; }
.adm-auth-box .logo-auth { display: none; }
.adm-auth-title { font-size: 24px; font-weight: 600; color: var(--adm-text); letter-spacing: -.015em; margin: 0 0 6px; }
.adm-auth-sub { color: var(--adm-muted); margin: 0 0 28px; font-size: 14px; line-height: 1.55; }
.adm-auth-box .form-label { font-weight: 500; font-size: 13.5px; color: var(--adm-text); margin-bottom: 6px; }
.adm-auth-label-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.adm-auth-label-row a, .adm-auth-link { font-size: 13px; font-weight: 500; }
.adm-auth-field { position: relative; }
.adm-auth-box .form-control { height: 44px; border-radius: 8px; border: 1px solid var(--adm-auth-border); padding: 0 12px; font-size: 14.5px; background: var(--adm-auth-input); color: var(--adm-text); box-shadow: none; }
.adm-auth-box .form-control:focus { border-color: var(--adm-blue); box-shadow: 0 0 0 3px rgba(var(--adm-blue-rgb), .18); }
.adm-auth-box .form-control.is-invalid { border-color: #dc2626; background-image: none; }
.adm-auth-box .form-control.is-invalid:focus { box-shadow: 0 0 0 3px rgba(220, 38, 38, .15); }
.adm-auth-field .form-control.has-toggle { padding-right: 46px; }
.adm-auth-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; border-radius: 6px; background: transparent; color: var(--adm-muted); }
.adm-auth-eye:hover { color: var(--adm-text); }
.adm-auth-eye:focus-visible { outline: 2px solid var(--adm-blue); outline-offset: -2px; color: var(--adm-text); }
.adm-auth-caps { display: none; margin-top: 6px; font-size: 12.5px; color: #b45309; }
[data-bs-theme="dark"] .adm-auth-caps { color: #fbbf24; }
.adm-auth-caps.is-on { display: block; }
.adm-auth-check { display: flex; align-items: center; gap: 10px; margin: 18px 0 24px; font-size: 13.5px; color: var(--adm-text); cursor: pointer; }
.adm-auth-check .form-check-input { width: 18px; height: 18px; margin: 0; border-radius: 4px; border-color: var(--adm-auth-border); cursor: pointer; }
.adm-auth-check .form-check-input:focus-visible { box-shadow: 0 0 0 3px rgba(var(--adm-blue-rgb), .25); }
.adm-auth-box .btn-primary { height: 44px; border-radius: 8px; font-weight: 600; font-size: 14.5px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.adm-auth-box .btn-primary:focus-visible { outline: 2px solid var(--adm-blue); outline-offset: 2px; }
.adm-auth-box .btn-primary[disabled] { opacity: .8; }
.adm-auth-error { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; margin-bottom: 20px; border-radius: 8px; background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; font-size: 13.5px; line-height: 1.5; }
.adm-auth-error i { margin-top: 3px; color: inherit; font-size: 13px; }
[data-bs-theme="dark"] .adm-auth-error { background: rgba(239, 68, 68, .1); border-color: rgba(239, 68, 68, .3); color: #fca5a5; }
.adm-auth-error.is-ok { background: #f0fdf4; border-color: #bbf7d0; color: #15803d; }
[data-bs-theme="dark"] .adm-auth-error.is-ok { background: rgba(34, 197, 94, .1); border-color: rgba(34, 197, 94, .3); color: #86efac; }
.adm-auth-note { margin: 16px 0 0; font-size: 12.5px; color: var(--adm-muted); text-align: center; }
.adm-auth-mobile-logo { display: none; height: 34px; width: auto; margin-bottom: 32px; }
[data-bs-theme="light"] .adm-auth-mobile-logo { filter: invert(1) hue-rotate(180deg); }

@media (max-width: 1199.98px) {
    .adm-auth-side { padding: 40px; }
    .adm-auth-list { display: none; }
}
@media (max-width: 991.98px) {
    .adm-auth { grid-template-columns: minmax(0, 1fr); }
    .adm-auth-side { display: none; }
    .adm-auth-mobile-logo { display: block; }
}
@media (max-width: 575.98px) {
    .adm-auth-main { justify-content: flex-start; padding: 40px 20px; }
    .adm-auth-after { margin-top: 32px; }
}

/* Default avatar (kaali lakeeron wali tasveer) dark mode me ulti — navy par dikhe */
[data-bs-theme="dark"] img[src*="images/users/user"] { filter: invert(.85); }

/* Scrollbar */
.app-default ::-webkit-scrollbar-thumb { background-color: rgba(107, 117, 145, .3); }

/* ---------------- Small shared fixes ---------------- */
/* "Show all" lists (show-more.js) */
.is-collapsed .adm-more-item { display: none !important; }
/* Status badges never stretch into a tall pill next to a wrapped title */
.db-card-header .db-badge, .card-header .db-badge { align-self: flex-start; flex-shrink: 0; white-space: nowrap; }
/* IDs like #7022 stay on one line */
.db-order-id { white-space: nowrap; }
/* Rate sync: a stopped run reads as a warning */
.rp-note.sy-note-failed { background: rgba(214, 69, 61, .08); color: #b4302a; }