/* XShopDigital v2.33.4 — Light/Dark Visual Contrast & UI Polish
   Final compatibility layer loaded after all legacy dashboard/public styles.
   Important: dashboard shells are intentionally dark even when the device/OS
   itself is in light mode, so these rules do not depend on [data-theme=dark]. */

/* Admin order contact actions: three compact primary contact buttons on the
   first row and the longer WhatsApp order-details action on its own row. */
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px!important;
  align-items:stretch!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions .order-contact-btn{
  width:100%;
  min-width:0;
  min-height:40px;
  padding:0 10px;
  text-align:center;
  line-height:1.25;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions .order-contact-btn.details{
  grid-column:1 / -1;
}

/* Admin order notes inherited the dashboard's light text while keeping the
   base light-mode note background whenever the device was in light mode.
   Force the note surface and text to the admin dark palette in every OS theme. */
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-notes-list .order-note-row{
  background:#2b2826!important;
  background-color:#2b2826!important;
  border-color:#4d4846!important;
  color:#eef3f7!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-notes-list .order-note-row.customer-visible{
  background:#2b2526!important;
  background-color:#2b2526!important;
  border-color:#6a3838!important;
  color:#f2f5f8!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-notes-list .order-note-row small{
  color:#b4bfca!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) .order-notes-list .order-note-row a{
  color:#ff7070!important;
}

/* Flash/toast markup uses toast-success / toast-error / toast-warning classes.
   Older theme rules targeted .toast.success instead, so semantic banners could
   inherit a mismatched foreground/background. Cover the actual rendered class
   names across admin, customer dashboard and public shells. */
.xsd-dashboard-dark .toast.toast-success,
.customer-dashboard-dark .toast.toast-success,
.public-site.xsd-dark-premium .toast.toast-success{
  background:#17291f!important;
  background-color:#17291f!important;
  border-color:#2e6f47!important;
  color:#eefbf3!important;
}
.xsd-dashboard-dark .toast.toast-error,
.customer-dashboard-dark .toast.toast-error,
.public-site.xsd-dark-premium .toast.toast-error{
  background:#351a1e!important;
  background-color:#351a1e!important;
  border-color:#7a333b!important;
  color:#fff1f2!important;
}
.xsd-dashboard-dark .toast.toast-warning,
.customer-dashboard-dark .toast.toast-warning,
.public-site.xsd-dark-premium .toast.toast-warning{
  background:#332816!important;
  background-color:#332816!important;
  border-color:#755b25!important;
  color:#ffefc2!important;
}
.xsd-dashboard-dark .toast.toast-info,
.customer-dashboard-dark .toast.toast-info,
.public-site.xsd-dark-premium .toast.toast-info{
  background:#1a2633!important;
  background-color:#1a2633!important;
  border-color:#365679!important;
  color:#edf5ff!important;
}
.xsd-dashboard-dark .toast,
.customer-dashboard-dark .toast,
.public-site.xsd-dark-premium .toast{
  color:#f6f8fb!important;
}
.xsd-dashboard-dark .toast button,
.customer-dashboard-dark .toast button,
.public-site.xsd-dark-premium .toast button{
  color:inherit!important;
}
.xsd-dashboard-dark .toast.toast-success .toast-icon,
.customer-dashboard-dark .toast.toast-success .toast-icon,
.public-site.xsd-dark-premium .toast.toast-success .toast-icon{
  background:#244733!important;color:#91e7b5!important;
}
.xsd-dashboard-dark .toast.toast-error .toast-icon,
.customer-dashboard-dark .toast.toast-error .toast-icon,
.public-site.xsd-dark-premium .toast.toast-error .toast-icon{
  background:#57242b!important;color:#ff9ba4!important;
}
.xsd-dashboard-dark .toast.toast-warning .toast-icon,
.customer-dashboard-dark .toast.toast-warning .toast-icon,
.public-site.xsd-dark-premium .toast.toast-warning .toast-icon{
  background:#54401d!important;color:#ffd27b!important;
}

/* Admin semantic result/notice surfaces that still came from the light base
   stylesheet. These are dashboard-theme rules, not OS-theme rules. */
.xsd-dashboard-dark:not(.customer-dashboard-dark) :where(.alert-success,.notice-success,.flash-success){
  background:#17291f!important;border-color:#2e6f47!important;color:#eefbf3!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) :where(.alert-error,.notice-error,.flash-error,.alert-danger,.order-admin-provision-error,.import-error-list){
  background:#351a1e!important;border-color:#7a333b!important;color:#fff1f2!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) :where(.alert-warning,.notice-warning,.flash-warning,.import-warning-list){
  background:#332816!important;border-color:#755b25!important;color:#ffefc2!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) :where(.alert-info,.notice-info,.flash-info,.order-admin-provision-note){
  background:#1a2633!important;border-color:#365679!important;color:#edf5ff!important;
}
.xsd-dashboard-dark:not(.customer-dashboard-dark) :where(.import-warning-list,.import-error-list) :where(h1,h2,h3,h4,b,strong,li){
  color:inherit!important;
}

/* Other semantic notice surfaces used in account/order areas. Keep readable
   regardless of the device's preferred color scheme. */
.xsd-dashboard-dark .subscription-alert{
  background:#2b2417!important;border-color:#5a4722!important;color:#f7c86e!important;
}
.xsd-dashboard-dark .subscription-alert.pending,
.xsd-dashboard-dark .subscription-alert.warning{
  background:#392a13!important;border-color:#6a4b1d!important;color:#ffc45d!important;
}
.xsd-dashboard-dark .subscription-alert.danger{
  background:#321a1d!important;border-color:#633038!important;color:#ff9aa3!important;
}
.xsd-dashboard-dark .secure-note{
  color:#d8e0e8!important;
}

@media(max-width:700px){
  .xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions{
    grid-template-columns:1fr 1fr;
  }
  .xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions .order-contact-btn.details{
    grid-column:1 / -1;
  }
}
@media(max-width:430px){
  .xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions{
    grid-template-columns:1fr;
  }
  .xsd-dashboard-dark:not(.customer-dashboard-dark) .order-admin-contact-actions .order-contact-btn.details{
    grid-column:auto;
  }
}