/* ===========================================================
   theme.css — LIGHT theme (white + blue header)
   =========================================================== */

:root{
  --cupsa-nav-h: 40px;
  --cupsa-radius: 8px;
  --cupsa-radius-sm: 5px;
  --cupsa-border: rgba(0,0,0,.08);
  --cupsa-muted: rgba(11,18,32,.55);
  --cupsa-pinned-bg: #fff8bf;
  --cupsa-pinned-bg-hover: #fff3a6;
  --cupsa-shadow: 0 12px 28px rgba(13,110,253,.10);
  --cupsa-shadow-strong: 0 18px 45px rgba(13,110,253,.18);
  --cupsa-edit-blue: rgba(13,110,253,.40);
  --cupsa-btn-shadow: 0 10px 18px rgba(13,110,253,.14);
  --cupsa-btn-shadow-hover: 0 14px 24px rgba(13,110,253,.18);
}

/* No gap above header */
html, body { margin: 0; padding: 0; }

body{
  padding-top: calc(var(--cupsa-nav-h) + 14px); /* ✅ space after header */
  color: #0b1220;

  /* soft background */
  background:
    radial-gradient(1200px 600px at 18% 0%, #e9f1ff 0%, transparent 70%),
    radial-gradient(1200px 600px at 88% 10%, #f2f6ff 0%, transparent 70%),
    linear-gradient(180deg, #f6f8ff 0%, #ffffff 68%);
}

/* ===========================================================
   NAVBAR (clean 3D, no underline, softer shadows, styled dropdown)
   =========================================================== */

/* Navbar base (softer shadow) */
.navbar.fixed-top{
  background: linear-gradient(180deg, #0d6efd 0%, #0b5ed7 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,.20) !important;
  box-shadow: 0 8px 18px rgba(13,110,253,.20) !important; /* ↓ lower */
  position: fixed;
}

/* Soft shine strip (subtle) */
.navbar.fixed-top::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height: 7px;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
  pointer-events:none;
}

/* Navbar text */
.navbar.fixed-top .navbar-brand,
.navbar.fixed-top .navbar-text{
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.18);
}

/* Links */
.navbar.fixed-top .nav-link{
  position: relative;
  padding: .44rem .78rem;
  margin: 0 .08rem;
  border-radius: 8px;
  font-weight: 500 !important;
  opacity: .98 !important;                 /* was .92 */
  color: rgba(255,255,255,.98) !important; /* force bright white */
  transition: transform .12s ease, background-color .12s ease, box-shadow .12s ease;
}


/* Hover = light 3D */
.navbar.fixed-top .nav-link:hover{
  background: rgba(255,255,255,.14);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 6px 14px rgba(0,0,0,.16); /* ↓ lower */
  transform: translateY(-1px);
}

/* ===========================================================
   NAV ACTIVE = subtle (≈20% diff), medium text, soft shadow
   =========================================================== */

/* Make nav text a bit lighter (not heavy) */
.navbar.fixed-top .nav-link{
  font-weight: 500 !important;
  opacity: .92;
}

/* Hover: very light (small difference) */
.navbar.fixed-top .nav-link:hover{
  background: rgba(255,255,255,.08) !important;  /* subtle */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 3px 8px rgba(0,0,0,.10) !important;        /* lower shadow */
  transform: translateY(-.5px) !important;
}

/* Active: only ~20% different from navbar (not too bright) */
.navbar.fixed-top .nav-link.active{
  background: rgba(255,255,255,.12) !important;  /* subtle active */
  border: 1px solid rgba(255,255,255,.16) !important;
  font-weight: 600 !important;                    /* medium, not bold */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 4px 10px rgba(0,0,0,.10) !important;        /* soft */
  opacity: .96 !important;
}

/* Ensure NO underline from any old rule */
.navbar.fixed-top .nav-link.active::after{ display:none !important; }

/* Dropdown open state should match active (not stronger) */
.navbar.fixed-top .dropdown.show > .nav-link{
  background: rgba(255,255,255,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 4px 10px rgba(0,0,0,.10) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}


/* ===========================================================
   NAV DROPDOWN: light-blue (navbar family) look
   =========================================================== */

.navbar.fixed-top .dropdown-menu{
  /* light blue glass */
  background: linear-gradient(180deg, rgba(233,241,255,.98), rgba(245,249,255,.98)) !important;
  border: 1px solid rgba(13,110,253,.18) !important;
  border-top: 3px solid rgba(13,110,253,.55) !important;
  border-radius: 8px !important;
  box-shadow: 0 14px 28px rgba(13,110,253,.14) !important;
  padding: .55rem !important;
  backdrop-filter: blur(6px);
}

/* items */
.navbar.fixed-top .dropdown-item{
  color: #0b1220 !important;
  border-radius: 5px;
  padding: .55rem .75rem;
}

/* hover = blue tint */
.navbar.fixed-top .dropdown-item:hover,
.navbar.fixed-top .dropdown-item:focus{
  background: rgba(13,110,253,.14) !important;
  color: #0b1220 !important;
  transform: translateX(2px);
}

/* divider softer */
.navbar.fixed-top .dropdown-divider{
  border-top: 1px solid rgba(13,110,253,.14) !important;
  margin: .45rem 0;
}

/* optional active item */
.navbar.fixed-top .dropdown-item.active,
.navbar.fixed-top .dropdown-item:active{
  background: rgba(13,110,253,.22) !important;
  color: #0b1220 !important;
  font-weight: 800;
}


/* ===== “Hero card” (dashboard top) ===== */
.cupsa-hero{
  border-radius: 12px;
  border: 1px solid rgba(13,110,253,.12);
  background:
    radial-gradient(900px 400px at 10% 0%, rgba(13,110,253,.16) 0%, transparent 70%),
    radial-gradient(900px 400px at 90% 10%, rgba(99,102,241,.10) 0%, transparent 70%),
    rgba(255,255,255,.75);
  backdrop-filter: blur(6px);
  box-shadow: var(--cupsa-shadow-strong);
}

.cupsa-hero-logo{
  border-radius: 8px;
  border: 1px solid var(--cupsa-border);
  background: rgba(255,255,255,.85);
  box-shadow: var(--cupsa-shadow);
  overflow:hidden;
}

.cupsa-pill{
  border-radius: 500px;
  padding: .32rem .65rem;
  border: 1px solid rgba(13,110,253,.25);
  background: rgba(13,110,253,.08);
  color: #0d6efd;
  font-weight: 600;
  font-size: .82rem;
}

/* ===== Cards ===== */
.card{
  border: 1px solid var(--cupsa-border);
  border-radius: var(--cupsa-radius);
  box-shadow: var(--cupsa-shadow);
  background: rgba(255,255,255,.90);
}

.card-header{
  background: rgba(255,255,255,.75);
  border-bottom: 1px solid var(--cupsa-border);
  border-top-left-radius: var(--cupsa-radius) !important;
  border-top-right-radius: var(--cupsa-radius) !important;
}

.card-footer{
  background: rgba(255,255,255,.75);
  border-top: 1px solid var(--cupsa-border);
  border-bottom-left-radius: var(--cupsa-radius) !important;
  border-bottom-right-radius: var(--cupsa-radius) !important;
}


/* Quick access cards */
.quick-card{
  border: 1px solid var(--cupsa-border);
  border-radius: 8px;
  background: rgba(255,255,255,.92);
  box-shadow: var(--cupsa-shadow);
  transition: transform .12s ease, box-shadow .12s ease;
}
.quick-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(13,110,253,.14);
}

.quick-icon{
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(13,110,253,.18);
  background: rgba(13,110,253,.07);
  color: #0d6efd;
}

/* ===== Text ===== */
.text-muted{ color: var(--cupsa-muted) !important; }

/* ===== Pinned rows ===== */
.cupsa-pinned-row > td,
.cupsa-pinned-row > th{
  background: var(--cupsa-pinned-bg) !important;
}

.cupsa-pinned-row:hover > td,
.cupsa-pinned-row:hover > th{
  background: var(--cupsa-pinned-bg-hover) !important;
}

/* ===== Forms ===== */
.form-control, .form-select{
  border-radius: var(--cupsa-radius-sm);
  border-color: rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(13,110,253,.55);
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.15);
}

/* ===== Buttons ===== */
.btn,
.cupsa-btn{
  border-radius: 10px;
  font-weight: 600;
  letter-spacing: .01em;
  box-shadow: var(--cupsa-btn-shadow);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.btn:hover,
.cupsa-btn:hover{
  transform: translateY(-1px);
  box-shadow: var(--cupsa-btn-shadow-hover);
}

.btn:disabled,
.btn.disabled,
.cupsa-btn:disabled,
.cupsa-btn.disabled{
  box-shadow: none;
  transform: none;
}

.btn-primary,
.cupsa-btn.btn-primary{
  background: linear-gradient(180deg, #1676ff 0%, #0b5ed7 100%);
  border-color: #0b5ed7;
}

.btn-success,
.cupsa-btn.btn-success{
  background: linear-gradient(180deg, #27b36a 0%, #198754 100%);
  border-color: #198754;
}

.btn-danger,
.cupsa-btn.btn-danger{
  background: linear-gradient(180deg, #ee5d6c 0%, #dc3545 100%);
  border-color: #dc3545;
}

.btn-secondary,
.cupsa-btn.btn-secondary{
  background: linear-gradient(180deg, #73849a 0%, #5c6774 100%);
  border-color: #5c6774;
}

.btn-warning,
.cupsa-btn.btn-warning{
  color: #0b1220;
  background: linear-gradient(180deg, #ffd466 0%, #ffc107 100%);
  border-color: #ffc107;
}

.btn-info,
.cupsa-btn.btn-info{
  color: #0b1220;
  background: linear-gradient(180deg, #74d9f5 0%, #0dcaf0 100%);
  border-color: #0dcaf0;
}

.btn[class*="btn-outline-"],
.cupsa-btn[class*="btn-outline-"]{
  background: rgba(255,255,255,.88);
}

.btn-outline-primary,
.cupsa-btn.btn-outline-primary{
  border-color: rgba(13,110,253,.45);
}

/* ===== Alerts ===== */
.alert{
  border-radius: 8px;
  border: 1px solid var(--cupsa-border);
}

/* ===== Tables: CLEAR difference between FILTER row and HEADING row ===== */

/* Filter row (1st thead row): light/white */
.table:not(.table-dark) thead tr:first-child th,
.table:not(.table-dark) thead tr:first-child td{
  background: rgba(255,255,255,.92) !important;
  color: #0b1220 !important;
  border-bottom: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: inset 0 -1px 0 rgba(13,110,253,.10);
}

/* Heading row (2nd thead row): stronger blue tint */
.table:not(.table-dark) thead tr:nth-child(2) th,
.table:not(.table-dark) thead tr:nth-child(2) td{
  background: linear-gradient(180deg, rgba(13,110,253,.22), rgba(13,110,253,.10)) !important;
  color: #0b1220 !important;
  font-weight: 800;
  letter-spacing: .2px;
  border-bottom: 1px solid rgba(0,0,0,.14) !important;
}

/* If some pages only have ONE header row, still make it look like a header */
.table:not(.table-dark) thead:has(tr:only-child) th{
  background: linear-gradient(180deg, rgba(13,110,253,.22), rgba(13,110,253,.10)) !important;
  font-weight: 800;
}

/* Inputs inside filter row */
.table:not(.table-dark) thead tr:first-child .form-control,
.table:not(.table-dark) thead tr:first-child .form-select{
  background: #ffffff !important;
  border-color: rgba(0,0,0,.14) !important;
  box-shadow: none !important;
}

/* ===== Table row hover (slight blue) ===== */
.table.table-hover > tbody > tr:hover > *{
  background: rgba(13,110,253,.07) !important;  /* light blue */
}

/* ===== List group ===== */
.list-group-item{
  border-color: var(--cupsa-border);
}

/* ===== Badges ===== */
.badge{
  border-radius: 500px;
}

/* ===== Tabs / Pills ===== */
.nav-pills .nav-link{
  border-radius: 8px;
}
.nav-pills .nav-link.active{
  background: #0d6efd;
}

/* ===== Pagination ===== */
.pagination .page-link{
  border-radius: 5px;
}

/* ===== Offcanvas / Modal radius ===== */
.offcanvas, .modal-content{
  border-radius: 8px;
}
.modal-content{
  border: 1px solid var(--cupsa-border);
}

/* ===== Footer small strip ===== */
.cupsa-footer-strip{
  border-radius: 8px;
  border: 1px solid var(--cupsa-border);
  background: rgba(255,255,255,.85);
}

.cupsa-footer-strip a{
  color:#0d6efd;
  text-decoration:none;
}
.cupsa-footer-strip a:hover{
  text-decoration:underline;
}

/* ===========================================================
   Printing pages helpers (Digital / Production)
   =========================================================== */

/* ✅ Add Print / Add Production background = 40% blue */
.card.cupsa-add-print .card-header,
.card.cupsa-add-print .card-body{
  background: rgba(13,110,253,.40) !important;
}

/* Keep inputs readable on blue */
.card.cupsa-add-print .form-control,
.card.cupsa-add-print .form-select{
  background: #fff !important;
}

/* ✅ Labels style inside Add Print / Add Production (same as edit block) */
.card.cupsa-add-print .form-label{
  font-weight: 600 !important;
  display: inline-block;
  padding: .18rem .45rem;
  border-radius: 8px;
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(13,110,253,.18);
  color: #0b1220 !important;
  line-height: 1.2;
}


/* ===========================================================
   TOP cards height cap + Artwork box
   =========================================================== */

/* Default (mobile/tablet) */
.cupsa-artwork-box{
  height: 260px;
  max-height: 260px;
}

/* If using Bootstrap .ratio, disable its padding trick */
.cupsa-artwork-box.ratio::before{
  padding-top: 0 !important;
}

/* Image fit  */
.cupsa-artwork-box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
}

/* Desktop sizing */
@media (min-width: 992px){
  .cupsa-top-card{ height: 450px; max-height: 450px; }
  .cupsa-top-card .card-body{ overflow: auto; }
  .cupsa-artwork-box{ height: 280px; max-height: 280px; }
}

/* ===========================================================
   Delivery Shipped page ONLY — taller top cards
   =========================================================== */
@media (min-width: 992px){
  .cupsa-top-card-delivery{
    height: 520px;
    max-height: 520px;
  }
  .cupsa-top-card-delivery .card-body{
    overflow: auto;
  }

  .cupsa-artwork-box-delivery{
    height: 450px;
    max-height: 450px;
  }
}


/* ===========================================================
   offset_tracking.php — SEND/RECEIVE form cards (same as edit block)
   =========================================================== */

/* ✅ 40% background on the whole card */
.card.cupsa-ot-send-card{ background: rgba(25,135,84,.40) !important; }
.card.cupsa-ot-recv-card{ background: rgba(13,110,253,.40) !important; }

/* Make body transparent so the card background shows */
.card.cupsa-ot-send-card .card-body,
.card.cupsa-ot-recv-card .card-body{
  background: transparent !important;
}

/* ✅ Labels: medium-bold + background */
.card.cupsa-ot-send-card .form-label,
.card.cupsa-ot-recv-card .form-label{
  font-weight: 600 !important;
  display: inline-block;
  padding: .18rem .45rem;
  border-radius: 8px;
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(0,0,0,.10);
  color: #0b1220 !important;
  line-height: 1.2;
}

/* ✅ Keep inputs readable on colored background */
.card.cupsa-ot-send-card .form-control,
.card.cupsa-ot-send-card .form-select,
.card.cupsa-ot-recv-card .form-control,
.card.cupsa-ot-recv-card .form-select{
  background: #fff !important;
}


.card.cupsa-edit-block{
  border: 1px solid rgba(13,110,253,.18) !important;
  border-radius: 14px !important;
  box-shadow: 0 14px 32px rgba(13,110,253,.18) !important;
}

/* Make the visible surfaces blue */
.card.cupsa-edit-block .card-header,
.card.cupsa-edit-block .card-body{
  background: rgba(13,110,253,.40) !important;
}

/* Inputs readable */
.card.cupsa-edit-block .form-control,
.card.cupsa-edit-block .form-select{
  background: #fff !important;
}

/* Labels background ONLY inside edit block */
.card.cupsa-edit-block .form-label{
  font-weight: 600 !important;
  display: inline-block;                 /* so background wraps text */
  padding: .18rem .45rem;
  border-radius: 8px;
  background: rgba(255,255,255,.70) !important;  /* light label background */
  border: 1px solid rgba(13,110,253,.18);
  color: #0b1220 !important;
  line-height: 1.2;
}

/* ===========================================================
   stock.php — (light tint + label bars)
   =========================================================== */

.cupsa-stock-recv-card{
  border: 2px solid rgba(25,135,84,.25);
  border-radius: var(--cupsa-radius);
  box-shadow: var(--cupsa-shadow);
  background: linear-gradient(180deg, rgba(25,135,84,.16) 0%, #ffffff 65%);
}

.cupsa-stock-send-card{
  border: 2px solid rgba(220,53,69,.25);
  border-radius: var(--cupsa-radius);
  box-shadow: var(--cupsa-shadow);
  background: linear-gradient(180deg, rgba(220,53,69,.14) 0%, #ffffff 65%);
}

/* headers (keep strong like offset) */
.cupsa-stock-recv-hdr{
  background:#198754 !important;
  color:#fff !important;
}
.cupsa-stock-send-hdr{
  background:#dc3545 !important;
  color:#fff !important;
}

/* keep all inputs white inside cards */
.cupsa-stock-page .cupsa-stock-recv-card .form-control,
.cupsa-stock-page .cupsa-stock-recv-card .form-select,
.cupsa-stock-page .cupsa-stock-send-card .form-control,
.cupsa-stock-page .cupsa-stock-send-card .form-select{
  background:#fff !important;
}

/* label bars tinted (like offset) */
.cupsa-stock-recv-card .form-label,
.cupsa-stock-send-card .form-label{
  font-weight: 600;
  display: block;
  width: 100%;
  padding: .20rem .50rem;
  border-radius: 10px;
  line-height: 1.2;
  color:#0b1220;
}

.cupsa-stock-recv-card .form-label{
  background: rgba(25,135,84,.10);
  border: 1px solid rgba(25,135,84,.18);
}

.cupsa-stock-send-card .form-label{
  background: rgba(220,53,69,.10);
  border: 1px solid rgba(220,53,69,.18);
}

/* ================================
   Dynamic Navigation
   ================================ */

.navbar .dropdown-submenu {
  position: relative;
}

/* Desktop: every deeper navigation level opens as a right-side flyout. */
@media (min-width: 992px){
  .navbar .dropdown-submenu > .dropdown-menu{
    position: absolute !important;
    inset: auto auto auto 100% !important;
    top: 0 !important;
    left: calc(100% + .65rem) !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 1100;
  }

  .navbar .dropdown-submenu.show > .dropdown-menu{
    display: block;
  }
}

/* Collapsed/mobile navbar remains usable by indenting deeper levels. */
@media (max-width: 991.98px){
  .navbar .dropdown-submenu > .dropdown-menu{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: .25rem 0 .25rem .85rem !important;
    box-shadow: none !important;
  }
}

/* Make sure nested menus can extend outside their parent dropdown. */
.navbar, .navbar .container-fluid, .navbar .dropdown-menu { overflow: visible; }

.cupsa-lang-switch .dropdown-menu{
  min-width: 11rem;
}

[dir="rtl"] body{
  text-align: right;
}

[dir="rtl"] .dropdown-menu{
  text-align: right;
}

[dir="rtl"] .me-auto{
  margin-right: 0 !important;
  margin-left: auto !important;
}

[dir="rtl"] .me-1{
  margin-right: 0 !important;
  margin-left: .25rem !important;
}

[dir="rtl"] .ms-1{
  margin-left: 0 !important;
  margin-right: .25rem !important;
}

/* Logout button in top navbar */
.navbar.fixed-top .btn-logout{
  color: #fff !important;
  background: linear-gradient(180deg, #ff6b6b 0%, #dc3545 100%) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 10px !important;
  padding: .38rem .90rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(220,53,69,.28) !important;
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.navbar.fixed-top .btn-logout:hover,
.navbar.fixed-top .btn-logout:focus{
  color: #fff !important;
  background: linear-gradient(180deg, #ff7d7d 0%, #c82333 100%) !important;
  box-shadow: 0 12px 22px rgba(220,53,69,.34) !important;
  transform: translateY(-1px);
}

.navbar.fixed-top .btn-logout:active{
  transform: translateY(0) !important;
  box-shadow: 0 6px 12px rgba(220,53,69,.24) !important;
}
/* ================================
   Excel export loading indicator
   ================================ */
.cupsa-export-overlay{
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.74);
  backdrop-filter: blur(2px);
}

.cupsa-export-overlay.show{
  display: flex;
}

.cupsa-export-box{
  width: min(420px, calc(100vw - 32px));
  padding: 26px 24px;
  border: 1px solid rgba(13,110,253,.20);
  border-radius: 16px;
  background: #fff;
  text-align: center;
  box-shadow: 0 18px 45px rgba(0,0,0,.18);
}

.cupsa-export-title{
  font-size: 1.15rem;
  font-weight: 700;
  color: #0d3b66;
  margin-bottom: .4rem;
}

.cupsa-export-text{
  color: #495057;
  font-size: .95rem;
  margin-bottom: .55rem;
}

.cupsa-export-small{
  color: #6c757d;
  font-size: .88rem;
}

a.cupsa-image-export-link.disabled{
  pointer-events: none;
  opacity: .72;
}

/* ===== Permission dashboard sections / admin dashboard ===== */
.dashboard-compact-hero{
  border-radius: 14px;
}
.dashboard-hero-icon{
  width: 50px;
  height: 50px;
  font-size: 24px;
}
.permission-section-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}
.dashboard-section{
  border: 1px solid rgba(13,110,253,.12);
  border-radius: 14px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 8px 22px rgba(13,110,253,.07);
}
.dash-section-card{
  padding: 8px;
  min-height: 0;
}
.dash-section-head{
  display: none;
}
.dash-section-icon,
.dash-section-title,
.dash-section-sub{
  display: none;
}
.dash-mini-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding-top: 0;
}
.dash-mini-card{
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 7px 8px;
  border-radius: 11px;
  border: 1px solid rgba(15,23,42,.07);
  background: #fff;
  color: #111827;
  text-decoration: none;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.dash-mini-card:hover{
  color: #0d6efd;
  border-color: rgba(13,110,253,.25);
  box-shadow: 0 10px 22px rgba(13,110,253,.11);
  transform: translateY(-1px);
}
.dash-mini-icon{
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: #315be8;
  background: #f0f5ff;
  border: 1px solid #d9e6ff;
  font-size: 16px;
}
.dash-mini-text{
  display: block;
  min-width: 0;
  flex: 1 1 auto;
}
.dash-mini-title{
  display: block;
  font-weight: 700;
  font-size: .89rem;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dash-mini-sub{
  display: block;
  color: #7a8495;
  font-size: .72rem;
  line-height: 1.15;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dash-mini-arrow{
  color: #9aa6bc;
  font-size: .75rem;
}
.admin-kpi-card,
.admin-count-card{
  transition: transform .12s ease, box-shadow .12s ease;
}
.admin-kpi-card:hover,
.admin-count-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(13,110,253,.14);
}
@media (max-width: 1199.98px){
  .permission-section-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 767.98px){
  .permission-section-grid{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 575.98px){
  .dash-mini-list{
    grid-template-columns: 1fr;
  }
}