/* Marslia Food — Admin Lotus theme (teal/gold) v5 */

:root {
  --ma-bg: #f3f6f5;
  --ma-ink: #172421;
  --ma-panel: #ffffff;
  --ma-teal: #0f6e66;
  --ma-teal-deep: #0b534c;
  --ma-teal-soft: rgba(15, 110, 102, 0.12);
  --ma-gold: #c4a574;
  --ma-gold-hot: #d4b896;
  --ma-sidebar: #0f172a;
  --ma-sidebar-2: #1e293b;
  --ma-sidebar-text: #e2e8f0;
  --ma-sidebar-hover: rgba(37, 99, 235, 0.15);
  --ma-sidebar-active: rgba(37, 99, 235, 0.22);
  --ma-muted: #5c6b67;
  --ma-line: rgba(23, 36, 33, 0.1);
  --ma-font: "Cairo", "Segoe UI", Tahoma, sans-serif;
  --ma-sidebar-w: 268px;
  --ma-radius: 16px;
  --ma-shadow: 0 12px 28px rgba(16, 36, 33, 0.08);
}

html[dir="rtl"],
html[lang="ar"],
body {
  font-family: var(--ma-font) !important;
}

body#crancy-dark-light,
body {
  background: var(--ma-bg) !important;
  color: var(--ma-ink) !important;
}

/* Sidebar brand */
.crancy-smenu .logo::after {
  content: "اللوتس للتوصيل";
  display: block;
  color: var(--ma-gold);
  font-size: 12px;
  font-weight: 800;
  margin-top: 6px;
  letter-spacing: 0;
}

.crancy-smenu,
.admin-menu,
.crancy-smenu .admin-menu {
  background: linear-gradient(180deg, var(--ma-sidebar) 0%, var(--ma-sidebar-2) 100%) !important;
}
.crancy-smenu:not(.crancy-close) {
  width: var(--ma-sidebar-w) !important;
}

.admin-menu a,
.crancy-smenu a,
.crancy-smenu span,
.crancy-smenu p,
.crancy-smenu li,
.admin-menu .menu-title {
  color: var(--ma-sidebar-text) !important;
  font-weight: 600;
  font-family: var(--ma-font) !important;
}

.admin-menu__title,
.crancy-smenu .admin-menu__title {
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 1;
  margin: 10px 12px 6px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
  border: 0 !important;
}

.menu-bar__name,
.menu-bar__text,
.admin-menu a .menu-bar__name {
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14.5px !important;
  line-height: 1.35 !important;
  max-width: 180px;
  display: inline-block;
  vertical-align: middle;
  color: #e2e8f0 !important;
  font-weight: 600 !important;
}

.menu-bar__one > li > a,
.crancy-dashboard-menu > li > a {
  padding: 11px 14px !important;
  border-radius: 8px !important;
  margin: 2px 8px !important;
  display: flex !important;
  align-items: center;
  gap: 10px;
  border: 0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
  transition: background 0.2s ease, color 0.2s ease;
}

.menu-bar__one > li,
.crancy-dashboard-menu > li,
.admin-menu__one,
.crancy-sidebar-padding {
  border: 0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

.admin-menu a:hover,
.crancy-smenu a:hover,
.admin-menu .active > a,
.crancy-smenu .active > a,
.menu-bar__one > li.active > a,
.crancy-dashboard-menu > li.active > a {
  color: #fff !important;
  background: var(--ma-sidebar-hover) !important;
  box-shadow: none !important;
}

.menu-bar__one > li.active > a,
.crancy-dashboard-menu > li.active > a,
.admin-menu .active > a {
  background: var(--ma-sidebar-active) !important;
}

html[dir="rtl"] .admin-menu a:hover,
html[dir="rtl"] .admin-menu .active > a,
html[dir="rtl"] .menu-bar__one > li.active > a {
  box-shadow: none !important;
}

.crancy-menu-icon svg,
.crancy-svg-icon {
  stroke: #93c5fd !important;
  color: #93c5fd !important;
}

.crancy-menu-icon i,
.lf-sidebar .crancy-menu-icon i {
  color: #93c5fd !important;
}

.logo,
.author,
.admin-menu__one + .admin-menu__one,
.crancy-smenu .logo {
  border-bottom: none !important;
  border-top: none !important;
}

.crancy-logo img {
  max-height: 42px;
}

/* Header */
.crancy-header,
.crancy-header__inner {
  background: rgba(255, 255, 255, 0.97) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ma-line);
}

.crancy-header__heading,
.crancy-header__heading h1,
.crancy-header__heading h2,
.crancy-header__heading h3,
.crancy-header__heading p {
  color: var(--ma-ink) !important;
  font-weight: 800;
  font-family: var(--ma-font) !important;
}

.crancy-header__heading h2,
.crancy-header__heading h3 {
  color: var(--ma-teal-deep) !important;
}

/* Cards / tables */
.crancy-body-area .card,
.crancy-table,
.crancy-productcard,
.crancy-default-card,
.crancy-wc__form-inner,
.crancy-table-card,
.crancy-ecom-card,
.crancy-ecom-card__v2 {
  background: var(--ma-panel) !important;
  border: 1px solid var(--ma-line) !important;
  border-radius: var(--ma-radius) !important;
  box-shadow: var(--ma-shadow);
  color: var(--ma-ink) !important;
}

.crancy-ecom-card__title,
.crancy-ecom-card__amount {
  color: var(--ma-ink) !important;
  font-family: var(--ma-font) !important;
}

.crancy-ecom-card__amount {
  color: var(--ma-teal-deep) !important;
  font-weight: 800 !important;
}

.bg-success-white,
.grid-icon-size.text-primary,
.text-primary {
  color: var(--ma-teal) !important;
}

.grid-icon-size {
  background: var(--ma-teal-soft) !important;
  border-radius: 50% !important;
}

.table,
.crancy-table table,
.dataTable {
  color: var(--ma-ink) !important;
  font-family: var(--ma-font) !important;
}

.table thead th,
.crancy-table thead th,
.dataTable thead th {
  color: var(--ma-teal-deep) !important;
  font-weight: 800 !important;
  background: #eef6f4 !important;
  border-color: var(--ma-line) !important;
}

.table td,
.crancy-table td {
  color: var(--ma-ink) !important;
}

/* Buttons */
.crancy-btn,
.btn-primary,
.btn-success,
button.crancy-btn {
  background: linear-gradient(135deg, var(--ma-teal) 0%, var(--ma-teal-deep) 100%) !important;
  border-color: var(--ma-teal-deep) !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-family: var(--ma-font) !important;
  font-weight: 700 !important;
}

.crancy-btn:hover,
.btn-primary:hover {
  filter: brightness(1.05);
}

.btn-outline-primary,
.crancy-btn--outline {
  color: var(--ma-teal-deep) !important;
  border-color: var(--ma-teal) !important;
}

/* Forms */
.form-control,
.form-select,
select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea {
  border-radius: 12px !important;
  border-color: var(--ma-line) !important;
  font-family: var(--ma-font) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--ma-teal) !important;
  box-shadow: 0 0 0 3px var(--ma-teal-soft) !important;
}

.badge,
.status,
.crancy-badge {
  font-weight: 700 !important;
  font-family: var(--ma-font) !important;
}

.crancy-progress-card,
.crancy-iconbox,
.crancy-product-card {
  border-radius: var(--ma-radius) !important;
}

.crancy-progress-card h4,
.crancy-iconbox h4,
.crancy-progress-card span,
.crancy-iconbox span {
  color: var(--ma-ink) !important;
  font-family: var(--ma-font) !important;
}

/* Chart accents */
.apexcharts-series path,
.ct-series-a .ct-area {
  fill-opacity: 0.25;
}

/* ========== Full-width content (no side gutters) ========== */
.crancy-body-area,
.crancy-main-body,
.container-fluid,
.crancy-adashboard {
  max-width: 100% !important;
  overflow-x: clip;
}

.crancy-adashboard .container,
.crancy-adashboard .container__bscreen,
.crancy-body-area .container,
.crancy-body-area .container__bscreen,
.crancy-header .container,
.crancy-dsinner,
.crancy-body {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (min-width: 992px) {
  html[dir="rtl"] body .crancy-body-area {
    padding-right: var(--ma-sidebar-w) !important;
    padding-left: 12px !important;
  }
  html[dir="ltr"] body .crancy-body-area {
    padding-left: var(--ma-sidebar-w) !important;
    padding-right: 12px !important;
  }
  html[dir="rtl"] .crancy-header {
    padding-right: var(--ma-sidebar-w) !important;
    padding-left: 0 !important;
  }
  html[dir="ltr"] .crancy-header {
    padding-left: var(--ma-sidebar-w) !important;
    padding-right: 0 !important;
  }

  html[dir="rtl"] .crancy-header__middle {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
  html[dir="ltr"] .crancy-header__middle {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .crancy-adashboard,
  .crancy-adashboard .container,
  .crancy-adashboard .container__bscreen {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .crancy-adashboard .row {
    --bs-gutter-x: 1rem;
  }
}

/* Kill bootstrap container centering gaps on wide screens */
@media (min-width: 1200px) {
  .crancy-adashboard .container,
  .crancy-adashboard .container__bscreen,
  .crancy-header .container {
    max-width: 100% !important;
    padding-inline: 12px !important;
  }
}

/* RTL shell */
html[dir="rtl"] .crancy-smenu {
  right: 0 !important;
  left: auto !important;
}

html[dir="rtl"] .text-start { text-align: right !important; }
html[dir="rtl"] .text-end { text-align: left !important; }

html[dir="rtl"] .crancy-header__right,
html[dir="rtl"] .crancy-header__group {
  flex-direction: row-reverse;
}

/* Mobile / tablet */
@media (max-width: 991.98px) {
  html[dir="rtl"] body .crancy-body-area,
  html[dir="rtl"] .crancy-header,
  html[dir="rtl"] .crancy-adashboard,
  body .crancy-body-area,
  .crancy-header,
  .crancy-adashboard,
  .crancy-header.crancy-close,
  .crancy-adashboard.crancy-close {
    padding-right: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }


  .crancy-smenu,
  .crancy-smenu.crancy-close,
  .crancy-smenu:not(.crancy-close) {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    width: min(86vw, 300px) !important;
    z-index: 2000 !important;
    transition: transform .25s ease, visibility .25s ease !important;
  }

  html[dir="rtl"] .crancy-smenu.crancy-close {
    right: 0 !important;
    transform: translateX(105%) !important;
    visibility: hidden;
    pointer-events: none;
    box-shadow: none !important;
    opacity: 0 !important;
  }
  html[dir="rtl"] .crancy-smenu:not(.crancy-close) {
    right: 0 !important;
    transform: none !important;
    visibility: visible;
    pointer-events: auto;
    box-shadow: -8px 0 24px rgba(0,0,0,.28) !important;
    opacity: 1 !important;
  }
  html[dir="ltr"] .crancy-smenu.crancy-close {
    left: 0 !important;
    transform: translateX(-105%) !important;
    visibility: hidden;
    pointer-events: none;
    opacity: 0 !important;
  }
  html[dir="ltr"] .crancy-smenu:not(.crancy-close) {
    left: 0 !important;
    transform: none !important;
    visibility: visible;
    opacity: 1 !important;
  }

  .crancy-smenu.crancy-close .crancy__sicon,
  .crancy-smenu.crancy-close .close-icon {
    display: none !important;
  }

  html[dir="rtl"] .crancy-header__middle,
  .crancy-header__middle {
    padding-left: 12px !important;
    padding-right: 12px !important;
    height: auto !important;
    min-height: 72px;
    flex-wrap: wrap;
  }

  .crancy-header__inner {
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 12px !important;
  }
  .crancy-header__heading {
    width: 100%;
    order: 3;
  }

  .crancy-adashboard,
  .crancy-body-area > .container,
  .crancy-header .container {
    padding-inline: 12px !important;
  }

  .row.g-4 > [class*="col-"],
  .crancy-progress-list [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .menu-bar__name {
    max-width: 190px;
  }
}

@media (max-width: 767.98px) {
  .crancy-body-area { padding: 12px !important; }
  .crancy-table table,
  .dataTable { min-width: 560px; }
}

@media (min-width: 992px) {
  .crancy-smenu.crancy-close {
    transform: none !important;
  }
}

/* DataTables Arabic-friendly */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
  font-family: var(--ma-font) !important;
  color: var(--ma-ink) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--ma-teal) !important;
  border-color: var(--ma-teal-deep) !important;
  color: #fff !important;
}

/* ========== v6: full-width RTL + submenu contrast + collapse fix ========== */

/* Stop LTR left-margin gutters that create empty left space in RTL */
html[dir="rtl"] .crancy-adashboard,
html[dir="rtl"] .crancy-adashboard.crancy-close,
html[dir="rtl"] .crancy-header,
html[dir="rtl"] .crancy-header.crancy-close {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html[dir="rtl"] .crancy-adashboard,
html[dir="rtl"] .crancy-adashboard.crancy-close {
  padding-left: 12px !important;
  padding-right: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

html[dir="rtl"] .crancy-header__middle,
html[dir="rtl"] .crancy-header.crancy-close .crancy-header__middle {
  padding-left: 16px !important;
  padding-right: 16px !important;
  width: 100% !important;
}

/* Sidebar open/closed widths — do NOT lock width when collapsed */
.crancy-smenu:not(.crancy-close) {
  width: var(--ma-sidebar-w) !important;
}
@media (min-width: 992px) {
  .crancy-smenu.crancy-close {
    width: 92px !important;
    transform: none !important;
  }
  html[dir="rtl"] body .crancy-body-area {
    padding-right: var(--ma-sidebar-w) !important;
    padding-left: 12px !important;
  }
  html[dir="rtl"] body:has(.crancy-smenu.crancy-close) .crancy-body-area {
    padding-right: 92px !important;
    padding-left: 12px !important;
  }
  html[dir="ltr"] body .crancy-body-area {
    padding-left: var(--ma-sidebar-w) !important;
    padding-right: 12px !important;
  }
  html[dir="ltr"] body:has(.crancy-smenu.crancy-close) .crancy-body-area {
    padding-left: 92px !important;
    padding-right: 12px !important;
  }
}

/* Collapse toggle — style only; visibility by breakpoint (avoid duplicates) */
.crancy__sicon {
  background: var(--ma-teal) !important;
  border: 2px solid var(--ma-gold) !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  align-items: center;
  justify-content: center;
  cursor: pointer !important;
  z-index: 50 !important;
  flex-shrink: 0;
}
.crancy__sicon span,
.crancy__sicon svg,
.crancy__sicon path {
  stroke: #fff !important;
}
/* Desktop: sidebar toggle only (header icon hidden) */
@media (min-width: 992px) {
  .crancy-smenu .logo {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-inline: 14px !important;
  }
  .crancy-smenu .crancy__sicon {
    display: inline-flex !important;
    position: static !important;
    margin: 0 !important;
  }
  .crancy-header .crancy__sicon {
    display: none !important;
  }
}
/* Mobile: header toggle only (sidebar icon hidden to avoid overlap/duplicate) */
@media (max-width: 991.98px) {
  .crancy-smenu .crancy__sicon {
    display: none !important;
  }
  .crancy-header .crancy__sicon {
    display: inline-flex !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
  }
}

/* Submenu / nested items — s.marslia slate contrast */
.crancy__dropdown,
.menu-bar__one-dropdown {
  background: rgba(255, 255, 255, 0.04) !important;
  border-radius: 8px !important;
  margin: 2px 10px 8px !important;
  padding: 4px 0 !important;
  border: 0 !important;
}
.menu-bar__one-dropdown li a,
.crancy__dropdown li a {
  color: #cbd5e1 !important;
  opacity: 1 !important;
  padding: 9px 14px !important;
  margin: 1px 6px !important;
  border-radius: 8px !important;
  border: 0 !important;
  font-size: 13.5px !important;
}
.menu-bar__one-dropdown .menu-bar__name,
.crancy__dropdown .menu-bar__name {
  color: #cbd5e1 !important;
  opacity: 1 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  max-width: 180px;
}
.menu-bar__one-dropdown li a:hover,
.crancy__dropdown li a:hover {
  background: rgba(37, 99, 235, 0.15) !important;
  color: #fff !important;
}
.menu-bar__one-dropdown li a .crancy-menu-icon svg,
.crancy__dropdown li a svg {
  stroke: #93c5fd !important;
  opacity: 1 !important;
}

/* Header utility icons contrast */
.crancy-header__blink,
.crancy-header__options a,
.crancy-header__settings a {
  color: var(--ma-teal-deep) !important;
  border: 1.5px solid rgba(15, 110, 102, 0.45) !important;
  background: #fff !important;
}
.crancy-header__blink svg,
.crancy-header__blink path,
.crancy-header__settings svg path {
  fill: var(--ma-teal-deep) !important;
  stroke: var(--ma-teal-deep);
}

/* Content uses full available width */
.crancy-adashboard .container,
.crancy-adashboard .container__bscreen,
.crancy-body-area .container,
.crancy-dsinner,
.crancy-body,
.crancy-adashboard .row {
  max-width: 100% !important;
  width: 100% !important;
}

/* Toggle as <button> reset */
button.crancy__sicon {
  appearance: none;
  -webkit-appearance: none;
  padding: 0;
  margin: 0;
  border-style: solid;
}

/* ========== Foodifly-inspired Lotus layout (keep teal) ========== */
.lf-sidebar .crancy-menu-icon i { width: 18px; text-align: center; color: #93c5fd !important; }
.lf-sidebar-user {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 12px 14px;
}
.lf-sidebar-user__name { color: #fff !important; font-weight: 800; font-size: 14px; }
.lf-sidebar-user__email { color: rgba(226,232,240,.72) !important; font-size: 12px; margin-top: 2px; }

.lf-welcome { margin-bottom: 8px; }
.lf-welcome h2 { margin: 0; font-weight: 900; color: var(--ma-ink); font-size: clamp(1.35rem, 2vw, 1.8rem); }
.lf-welcome p { margin: 6px 0 0; color: var(--ma-muted); }

.lf-stat-card {
  background: #fff;
  border: 1px solid var(--ma-line);
  border-radius: 18px;
  padding: 18px 16px;
  box-shadow: var(--ma-shadow);
  height: 100%;
}
.lf-stat-card__label { color: var(--ma-muted); font-weight: 700; font-size: .9rem; }
.lf-stat-card__value { margin-top: 10px; font-size: 1.8rem; font-weight: 900; color: var(--ma-teal-deep); }
.lf-stat-card__hint { color: var(--ma-gold); font-size: 1.1rem; }

.lf-panel {
  background: #fff;
  border: 1px solid var(--ma-line);
  border-radius: 20px;
  padding: 18px 18px 8px;
  box-shadow: var(--ma-shadow);
}
.lf-panel__head h4 { margin: 0; font-weight: 900; color: var(--ma-ink); }
.lf-panel__head p { margin: 4px 0 14px; color: var(--ma-muted); font-size: .92rem; }

.lf-bars {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 10px; min-height: 180px; padding: 8px 4px 12px;
}
.lf-bars__col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.lf-bars__bar {
  width: 100%; max-width: 34px; border-radius: 10px 10px 4px 4px;
  background: linear-gradient(180deg, #148077, #0b534c);
}
.lf-bars__label { font-size: .8rem; color: var(--ma-muted); font-weight: 700; }
.lf-bars__value { font-size: .72rem; color: var(--ma-teal); font-weight: 700; }

.lf-status-list { list-style: none; padding: 0; margin: 0 0 12px; }
.lf-status-list li {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--ma-line); font-weight: 700;
}
.lf-status-list li:last-child { border-bottom: 0; }
.lf-status-list span { color: var(--ma-muted); }
.lf-status-list strong { color: var(--ma-teal-deep); }

.lf-table thead th {
  background: #f4faf8 !important; color: var(--ma-teal-deep) !important;
  font-weight: 800 !important; border: 0 !important;
}
.lf-badge { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; padding: 4px 10px; font-weight: 800; font-size: .85rem; }
.lf-badge--gold { background: rgba(196,165,116,.18); color: #8a6a35; }

/* Soften Crancy cards toward Foodifly cards */
.crancy-ecom-card, .crancy-ecom-card__v2 {
  border-radius: 18px !important;
  border: 1px solid var(--ma-line) !important;
  box-shadow: var(--ma-shadow) !important;
  background: #fff !important;
}
.crancy-header {
  background: #fff !important;
  border-bottom: 1px solid var(--ma-line) !important;
  box-shadow: none !important;
}
.crancy-header__title { color: var(--ma-ink) !important; font-weight: 900 !important; }
.crancy-header__text { color: var(--ma-muted) !important; }

/* Auth split closer to Foodifly */
body.mf-admin-auth .mf-auth__story {
  background: linear-gradient(145deg, #0f6e66 0%, #0b534c 55%, #12312e 100%) !important;
}