:root {
  --bg: #f6f7f8;
  --accent: #b90b0b;
  --deep: #9b0a0a;
  --muted: #6b6f73;
  --card: #ffffff;
  --sidebar: #ffffff;
  --sidebar-border: #f0efef;
  --red-ghost: rgba(185, 11, 11, 0.06);
}

button.swal2-confirm.swal2-styled {
    background: radial-gradient(circle, #ff0062 0%, #b40000 100%)!important;
}
h2#swal2-title {
    font-size: 18px!important;
}


.dashboard-login-message {
  min-height: 300px;
  display: grid;
  place-items: center;
}
.page-1458 .wrap {
  margin: 0px !important;
  max-width: 100% !important;
}

.page-1458 .padding {
  padding: 0px !important;
}

.page-1468 .padding {
  padding: 0px !important;
}

.page-1458 .section-above-footer.padding,
.page-1468 .section-above-footer.padding {
  padding: 85px 0 !important;

}
.page-1458 #wrap .section-above-footer .wrap ,
.page-1468 #wrap .section-above-footer .wrap {
  max-width: 94% !important;
  min-width: auto !important;
}

@media (max-width: 1024px) {
  .page-1458 .section-above-footer.padding,
  .page-1468 .section-above-footer.padding {
    padding: 35px 0 !important;

  }

}

.dashboard-container {
  margin-top: 25px;
  box-sizing: border-box;
  height: auto;
  /*margin: 0;*/
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  background: var(--bg);
  color: #1f2933;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



/* Top header */
.topbar {
  height: 64px;
  padding: 0 40px;
  display: flex;
  align-items: center;
  background: linear-gradient(90deg, #9d1b1b 10%, #b85a5a 40%, #6fcbd9 100%);
  color: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  width: 100%;
  position: relative;
  top: 82px;
}

.topbar .title .title-content {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.625rem;
  gap: 0.5rem;
  align-items: center;
  display: flex;
  margin-bottom: 0;
  margin-top: 0px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.topbar .subtitle p {
  color: rgb(255 255 255 / 0.9);
  margin: 0;
  opacity: 0.95;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  font-size: 18px;
  font-weight: 500;
}

.topbar .right {
  margin-left: auto;
}

.badge {
  background: rgba(255, 255, 255, 0.12);
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 600;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

/* layout */
.wrap-container {
  display: flex;
  width: 100%;
  min-height: 100vh;
  max-height: none !important;
  position: relative;
  left: 0;
  right: 0;
  top: 82px !important;
  bottom: 0;
  /* padding-bottom: 5rem !important; */
}

.sidebar {
  width: 15rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  border-radius: 6px;
  padding: 14px 1rem;
  --tw-border-opacity: 1;
  border-right: 1px solid rgb(229 231 235 / var(--tw-border-opacity, 1));
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
}

.nav-title {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 1.75rem;
  margin-bottom: 1rem;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.nav {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 12rem;
}

.nav li {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, fill, stroke,
    -webkit-text-decoration-color;
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  text-align: left;
  cursor: pointer;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  gap: 0.75rem !important;
  align-items: center !important;
  width: 100%;
  display: flex;
  position: relative !important;
  border-radius: 8px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  margin-bottom: 0px !important;
  /* Wrapped navigation labels must keep separate, readable lines. */
  line-height: 1.5 !important;
}

.nav li .nav-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  text-decoration: none;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.nav li:before {
  content: none !important;
  position: static !important;
  left: 0;
  top: 0;
}


.nav li svg {
  flex: 0 0 20px;
  opacity: 0.9;
}

.nav li.active svg {
  flex: 0 0 20px;
  opacity: 0.9;
  --tw-text-opacity: 1;
  color: rgb(180 0 0 / var(--tw-text-opacity, 1));
}

.nav li:hover {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.nav li.active {
  --tw-bg-opacity: 1;
  background-color: rgb(251 233 233 / var(--tw-bg-opacity, 1));
  border-left: 4px solid #b90b0b;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  font-weight: 600;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  padding-left: 1rem;
}

/* content */
.page-1458 .content ,
.page-1468 .content {
  flex: 1;
  padding: 1rem 1rem 80px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  flex: 1 1 0%;
}

.page-header {
  margin-bottom: 1.5rem;
}

.page-header h2 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 2rem;
  margin-bottom: 0.5rem;
  margin-top: 0px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.page-header p {
  margin: 0;
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
  font-size: 15px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  display: grid;
}

.card {
  animation-duration: 300ms;
  transition-duration: 300ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  color: hsl(var(--card-foreground));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-border-opacity: 1;
  border: 1px solid rgb(229 231 235 / var(--tw-border-opacity, 1));
  border-radius: 8px;
}

.card:hover {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
    0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),
    0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  border-color: rgb(111 203 217 / 0.5);
}

.card-head {
  padding: 1.5rem 1.5rem 0.75rem 1.5rem;
  flex-direction: row;
  display: flex;
  gap: 0.75rem;
  align-items: center;
}

.mialab-dashboard .logo {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  display: flex;
  flex-shrink: 0;
}

.logo.eye {
  --tw-bg-opacity: 1;
  background-color: rgb(111 203 217 / var(--tw-bg-opacity, 1));
  width: 50px;
  flex-shrink: 0;
}

.logo.red {
  --tw-bg-opacity: 1;
  background-color: rgb(180 0 0 / var(--tw-bg-opacity, 1));
  width: 50px;
  flex-shrink: 0;
}

.logo.gray {
  --tw-bg-opacity: 1;
  background-color: rgb(71 85 105 / var(--tw-bg-opacity, 1));
  width: 50px;
  flex-shrink: 0;
}

.card h3 {
  margin: 0;
  font-size: 18px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
  /* extra support for breaking words */
  width: auto;
}

.card p {
  margin: 0;
  color: var(--muted) !important;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
  /* extra support for breaking words */
  width: auto;
}

.card .open-btn {
  transition-property: color, background-color, border-color, fill, stroke,
    -webkit-text-decoration-color;
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-ring-offset-color: hsl(var(--background));
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  --tw-bg-opacity: 1;
  background-color: rgb(180 0 0 / var(--tw-bg-opacity, 1));
  border-radius: 8px;
  white-space: nowrap;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 2.5rem;
  max-height: auto;
  display: inline-flex;
  cursor: pointer;
  border: none;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
  /* extra support for breaking words */
}

.card .open-btn:hover {
  background-color: rgb(180 0 0 / 0.9);
}

/* Make button full width like screenshot */
.card .open-row {
  padding: 0px 1.5rem 1.5rem 1.5rem;
}

.full-btn {
  width: 100%;
  text-align: left;
}

/* smaller row cards that contain two columns per row */
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

@media (max-width: 768px) {
.content-section h3 {
  margin-top: 15px!important;
}
  .card h3 {
    white-space: normal;
    /* allows wrapping */
    overflow-wrap: break-word;
    /* forces long words to wrap */
    word-break: break-word;
    /* extra support for breaking words */
    width: auto;
  }

  .card p {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    width: auto;
  }

  .login-panel {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
  }

  .login-panel .panel-heading {
    width: 100% !important;
    padding-left: 28px !important;
  }

  .panel-body {
    width: 35rem !important;
  }
 
  #contentArea h2 {
    margin-top: 10px !important;
  }
}

/* responsive */
@media (max-width: 1000px) {
  .wrap-container {
    padding: 0px;
    height: auto;
    max-height: 100vh;
    overflow-y: scroll;
    margin-bottom: 20px;
    top: 58px !important;
    content: "";
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .sidebar {
    display: none;
  }

  .topbar {
    height: 88px;
    padding: 10px 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1 !important;
  }

  .button-small span {
    display: none;
  }

  .login-panel {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
  }

  .login-panel .panel-heading {
    width: 100% !important;
    padding-left: 28px !important;
  }

  .panel-body {
    width: 35rem !important;
  }
}

@media (max-width: 1024px) {
  footer .wrap .top .flex {
    padding: 0px 40px 0px 40px !important;
  }

  .sidebar {
    position: fixed;
    top: 0;
    left: -260px;
    /* hidden by default */
    width: 260px;
    height: 100%;
    background: #fff;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
    transition: left 0.3s ease;
    z-index: 111111 !important;
    /* above overlay */
    overflow: auto;
  }

  .sidebar.open {
    left: 0;
    /* slide in when open */
    display: block;
  }

  body.sidebar-open::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    /* below sidebar */
    position: fixed;
  }

  .hamburger {
    position: relative;
    left: 16px;
    top: 86px !important;
    /* adjust if needed */
    z-index: 999999999 !important;
    /* above everything */
    display: block;
    background: none;
    border: none;
    cursor: pointer;
  }

  /* When sidebar is open — move hamburger to top-right */
  body.sidebar-open .hamburger {
    position: fixed;
    left: 217px;
    right: 0px;
    top: 8px !important;
    z-index: 999999999 !important;
  }

  .hamburger-line {
    display: block;
    width: 25px;
    height: 3px;
    background: #000;
    margin: 5px 0;
    border-radius: 3px;
  }

  body.sidebar-open .hamburger-line {
    background: #000;
    width: 18px;
    /* ↓ reduced from 25px */
    height: 2px;
    /* ↓ reduced from 3px */
  }

  .topbar .title .title-content svg {
    width: 40px;
    height: 40px;
  }

  .content {
    padding: 1.5rem;
  }
}

/* Hide hamburger on desktop */
@media (min-width: 1025px) {
  .hamburger {
    display: none;
  }

  .sidebar {
    position: static;
    left: 0;
    height: auto;
    box-shadow: none;
    z-index: auto;
  }
}

/* little icon styles for left navigation */
.icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ud-sidebar {
  width: 220px;
  border-right: 1px solid #eee;
}

.ud-content {
  flex: 1;
}

.ud-menu {
  list-style: none;
  padding: 0;
}

.ud-menu li {
  margin-bottom: 10px;
}

.ud-menu a {
  text-decoration: none;
  color: #0073aa;
}

.ud-menu a:hover {
  text-decoration: underline;
}

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

.ud-order-table th,
.ud-order-table td {
  border: 1px solid #ddd;
  padding: 8px;
}

.ud-order-table th {
  background: #f8f8f8;
}

.mialab-documents-container {
  max-width: 100%;
  margin: 0px;
  font-family: "Inter", system-ui, sans-serif;
}

.mialab-doc-section {
  background: #fff;
  border: 1px solid #e6e9ee;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 24px;
}

.mialab-doc-section-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-weight: 700;
  color: #0b1220;
  margin-bottom: 20px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
}

.mialab-doc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 28rem;
  overflow: auto;
}

.mialab-doc-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border: 1px solid #e6e9ee;
  border-radius: 10px;
  padding: 14px 18px;
}

.mialab-doc-item:hover {
  background-color: rgb(239 246 255 / 0.5);
}

.mialab-doc-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mialab-file-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(12, 125, 125, 0.06);
  color: #0ea5a4;
}

.mialab-meta .mialab-title {
  font-weight: 600;
  font-size: 15px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
}

.mialab-meta .mialab-sub {
  color: #6b7280;
  font-size: 13px;
  margin-top: 4px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
  white-space: normal;
  /* allows wrapping */
  overflow-wrap: break-word;
  /* forces long words to wrap */
  word-break: break-word;
}

.mialab-download-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #e6e9ee;
  background: #fff;
  color: #0f172a;
  font-size: 14px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.15s ease;
}

.mialab-download-btn:hover {
  background: #f4f6f8;
}

.mialab-no-docs {
  color: #888 !important;
  font-style: italic;
  font-size: 14px !important;
  padding-left: 4px !important;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.mialab-doc-icon {
  color: #0ea5a4;
}

.mialab-doc-item:before {
  content: none !important;
  position: static !important;
  left: 0;
  top: 0;
}

/*.wysiwyg ul li {*/
/*  padding-left: 18px !important;*/
/*  margin-bottom: 0px !important;*/
/*}*/

header {
  padding: 17px 17px !important;
}

.mialab-documents-header {
  margin-top: 8px;
  margin-bottom: 1.5rem;
}

.mialab-documents-title {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 2rem;
  margin-bottom: 0.5rem;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.mialab-documents-sub-title {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial;
}

.wysiwyg ul {
  margin-left: 0px !important;
  margin-bottom: 0px !important;
}

header .login-sign-up span {
  display: inline-block !important;
  margin: 0 5px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 120px !important;
}

.mialab-doc-right {
  flex-shrink: 0;
}

/* Common button styles */
.mialab-doc-right button,
.mialab-doc-right a.button.button-small {
  --tw-ring-offset-color: hsl(var(--background));
  --tw-text-opacity: 1;
  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25rem;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  --tw-border-opacity: 1;
  border: 1px solid rgb(209 213 219 / var(--tw-border-opacity, 1));
  white-space: nowrap;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  height: 2.25rem;
  display: inline-flex;
  cursor: pointer;
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
  text-transform: none;
  font-family: "Inter", sans-serif;
  border-radius: 0.5rem;
  text-decoration: none;
  /* important for <a> links */
}

/* Hover effect for both */
.mialab-doc-right button:hover,
.mialab-doc-right a.button.button-small:hover {
  color: hsl(var(--accent-foreground));
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.dashboard-svg-icon-class {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
}

footer .top {
  padding: 55px 47px !important;
}

.page-1458 .section-above-footer .wrap .flex,
.page-1468 .section-above-footer .wrap .flex {
  padding: 55px 47px !important;
}

.page-1458 .section-above-footer,
.page-1468 .section-above-footer {
  position: relative;
  top: 82px;
}

.content-section h3 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 2rem;
  margin-bottom: 0rem;
  font-family: "Inter", sans-serif;
}

.content-section p {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1)) !important;
  font-family: "Inter", sans-serif;
  font-size: 14px !important;
}

/* ── Dashboard bottom containment fix ─────────────────────────────────
   .wrap-container uses position: relative; top: 82px — its visual bottom
   extends 82px beyond its DOM space. padding-bottom on .dashboard-container
   ensures the page body extends far enough so nothing gets clipped by the
   theme's parent containers. Applies to all dashboard tabs via the shared
   wrapper. No scroll behavior or layout structure is changed.
   ──────────────────────────────────────────────────────────────────────── */
.page-1458 .dashboard-container,
.page-1468 .dashboard-container {
  padding-bottom: 100px;
  margin-top: 0 !important;
}

/* ── Dashboard page (ID 1458) only: hide lower theme sections ──────────
   Hides the "Have Questions?" / CTA / contact / newsletter / promotional
   theme sections that render below the [user_dashboard] shortcode output.
   Scoped exclusively to body.page-1458 — no other page is affected.
   ─────────────────────────────────────────────────────────────────────── */
.page-1458 .section-above-footer,
.page-1468 .section-above-footer {
    display: none !important;
}

/* ── Dashboard pages (1458 / 1468) only: hide website footer ──────────
   Hides the theme footer and any bottom wrapper spacing so the dashboard
   feels fully contained. Covers the four common footer patterns used
   across WordPress themes. Zero effect on any other page.
   ─────────────────────────────────────────────────────────────────────── */
body.page-1458 footer,
body.page-1458 #footer,
body.page-1458 .site-footer,
body.page-1458 #colophon,
body.page-1468 footer,
body.page-1468 #footer,
body.page-1468 .site-footer,
body.page-1468 #colophon {
    display: none !important;
}

/* Remove bottom margin/padding the theme reserves for the footer */
body.page-1458 #page,
body.page-1458 #wrapper,
body.page-1458 #outer-wrapper,
body.page-1468 #page,
body.page-1468 #wrapper,
body.page-1468 #outer-wrapper {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   DASHBOARD FULL-SCREEN — page 1458 only
   Hides the theme header/nav and removes the top offset that was
   compensating for the header height. Zero effect on any other page.
   WP admin bar is unaffected (WordPress handles its own 32px margin-top
   on <html> — we never touch that).
   ═══════════════════════════════════════════════════════════════════════ */

/* 1 ── Hide theme header and navigation ─────────────────────────────── */
body.page-1458 header,
body.page-1458 #header,
body.page-1458 .site-header,
body.page-1458 #masthead {
    display: none !important;
}

/* 2 ── Remove top padding/margin theme wrappers add below the header ── */
body.page-1458 #page,
body.page-1458 #content,
body.page-1458 .site-content,
body.page-1458 .content-area,
body.page-1458 .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* 3 ── Drop the dashboard banner and content panel to fill the
        reclaimed space (desktop only — mobile keeps its own offsets) ── */
@media (min-width: 1025px) {
    .page-1458 .topbar {
        top: 0 !important;
    }
    .page-1458 .wrap-container {
        top: 0 !important;
    }
}

/* ═══════════════════════════════════════════════════════════════════════
   ORDER ENTRY — iframe UX
   All rules scoped to .iframe-container, .iframe-wrapper, .oe-loading,
   .iframe-fullscreen-btn, .iframe-exit-fullscreen-btn, body.iframe-fullscreen-active.
   No other tab, page, or vendor is affected.
   ═══════════════════════════════════════════════════════════════════════ */

/* Outer container — shown once a vendor is opened */
.iframe-container {
    margin-top: 8px;
}

/* Wrapper — single element targeted for fullscreen toggle */
.iframe-wrapper {
    position: relative;
    width: 100%;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
}

/* Iframe in normal embedded mode */
.iframe-wrapper iframe {
    display: block;
    width: 100%;
    height: 85vh;
    min-height: 620px;
    border: 0;
    transition: opacity 0.35s ease;
}

/* Loading overlay */
.oe-loading {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    background: #ffffff;
    z-index: 10;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    font-size: 14px;
    color: #6b7280;
    min-height: 200px;
}

.oe-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid #e5e7eb;
    border-top-color: #b40000;
    border-radius: 50%;
    animation: oe-spin 0.75s linear infinite;
    flex-shrink: 0;
}

@keyframes oe-spin {
    to { transform: rotate(360deg); }
}

/* Enter-fullscreen button — floating over iframe, top-right */
.iframe-fullscreen-btn {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 100000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 7px;
    cursor: pointer;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.14);
    color: #374151;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}
.iframe-fullscreen-btn:hover {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    color: #111827;
}

/* Exit-fullscreen button — fixed pill, visible only in fullscreen */
.iframe-exit-fullscreen-btn {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 100001;
    display: none;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    background: rgba(0, 0, 0, 0.72);
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: background 0.15s ease;
    white-space: nowrap;
}
.iframe-exit-fullscreen-btn:hover {
    background: rgba(0, 0, 0, 0.9);
}

/* Shift exit button below WP admin bar */
body.admin-bar .iframe-exit-fullscreen-btn {
    top: 48px;
}
@media screen and (max-width: 782px) {
    body.admin-bar .iframe-exit-fullscreen-btn {
        top: 62px;
    }
}

/* ── Fullscreen mode ──────────────────────────────────────────────────── */
body.iframe-fullscreen-active {
    overflow: hidden;
}

.iframe-wrapper.is-fullscreen {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99999;
    background: #ffffff;
    margin: 0;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

.iframe-wrapper.is-fullscreen iframe {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
}

/* Account for WP admin bar in fullscreen */
body.admin-bar .iframe-wrapper.is-fullscreen {
    top: 32px;
    bottom: 0;
    height: auto;
}
@media screen and (max-width: 782px) {
    body.admin-bar .iframe-wrapper.is-fullscreen {
        top: 46px;
    }
}

/* Dashboard navigation and delivery card alignment. */
.mialab-dashboard .sidebar {
  flex-shrink: 0;
}

.mialab-dashboard .sidebar .nav {
  width: 100%;
}

.mialab-dashboard .sidebar .nav > li {
  box-sizing: border-box;
  border-left: 4px solid transparent;
  padding-left: calc(1rem - 4px) !important;
}

.mialab-dashboard .sidebar .nav > li.active {
  border-left-color: #b90b0b;
}

.mialab-dashboard .sidebar .nav-link {
  min-width: 0;
  line-height: 1.5;
}

.mialab-dashboard .sidebar .nav-link > span:last-child {
  white-space: nowrap;
}

.mialab-dashboard .wrap-container > .content {
  min-width: 0;
}

.mialab-dashboard .delivery-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.mialab-dashboard .delivery-card > .dl-btn {
  margin-top: auto;
}
