@import url('fonts/poppins.css');
/* Tipografía de referencia: ArcaOne Gastronomía Dashboard. */
.ao-body{font-family:Poppins,sans-serif;font-size:12px;line-height:1.6;-webkit-font-smoothing:antialiased}
.ao-body button,.ao-body input,.ao-body select,.ao-body textarea{font-family:Poppins,sans-serif!important}
.ao-body h1,.ao-body h2,.ao-body h3,.ao-body p,.ao-body table{font-family:Poppins,sans-serif}
.ao-body .ao-sidebar nav button{font-size:11px;font-weight:600;line-height:1.5}
.ao-body .ao-category-label{font-size:8px;font-weight:600;letter-spacing:1.3px;line-height:1.6}
.ao-body .ao-business strong{font-size:12px;font-weight:600;line-height:1.5}
.ao-body .ao-business>span,.ao-body .ao-logo>span{font-size:9px;line-height:1.6}
.ao-body .ao-site-link{font-size:11px;font-weight:500;line-height:1.5}
.ao-body .ao-page-heading h1{font-size:30px;font-weight:700;letter-spacing:-1px;line-height:1.25}
.ao-body .estate-kicker{font-size:9px;font-weight:700;letter-spacing:1.5px;line-height:1.7}
.ao-body .ao-panel-header h2{font-size:18px;font-weight:700;letter-spacing:-.35px;line-height:1.4}
.ao-body .ao-panel-header p{font-size:12px;font-weight:400;line-height:1.8}
.ao-body .ao-metrics article>span{font-size:10px;line-height:1.6}
.ao-body .ao-metrics strong{font-size:25px;font-weight:700;letter-spacing:-.6px;line-height:1.3}
.ao-body .ao-metrics small{font-size:9px;line-height:1.8}
.ao-body .ao-search input,.ao-body .ao-reset,.ao-body .ao-topbar button{font-size:10px}
.ao-body .estate-button,.ao-body .ao-secondary,.ao-body .ao-quick-actions button,.ao-body .ao-quick-actions a{font-size:11px;font-weight:600;line-height:1.5}
.ao-body .ao-panel th{font-size:9px;font-weight:600;line-height:1.6}
.ao-body .ao-panel td{font-size:11px;line-height:1.8}
.ao-body .ao-panel td strong,.ao-body .ao-property-name{font-weight:600}
.ao-body .module-system-grid strong{font-size:12px;font-weight:600;line-height:1.6}
.ao-body .module-system-grid small{font-size:10px;font-weight:400;line-height:1.8}
.ao-body .module-system-grid button>span{font-size:8px;letter-spacing:1px;font-weight:500}
.ao-body .ao-files-grid h3{font-size:16px;font-weight:600;line-height:1.5}
.ao-body .ao-demo-note,.ao-body .ao-section-note{font-size:10px;line-height:1.8}
.ao-body #ao-editor h2{font-size:18px;font-weight:700;line-height:1.4;letter-spacing:-.35px}
.ao-body #ao-editor label{font-size:11px;font-weight:500;line-height:1.6}
.ao-body #ao-editor input,.ao-body #ao-editor select,.ao-body #ao-editor textarea{font-size:12px;line-height:1.6}
@media(max-width:750px){.ao-body .ao-page-heading h1{font-size:25px}.ao-body .ao-sidebar nav button{font-size:10px}}

/* Categorías: misma tipografía que los módulos de Gastronomía. */
.ao-body .ao-sidebar summary,.ao-body .ao-sidebar .ao-category-label,.ao-body .ao-sidebar .ao-nav-group{font-family:Poppins,sans-serif!important;font-size:11px;font-weight:600;letter-spacing:0;line-height:1.5;text-transform:none}

/* Íconos agrandados en todos los dashboards de todas las verticales */
.ao-body .ao-sidebar nav button>svg,
.ao-sidebar nav button>svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

.ao-body .ao-sidebar nav details.ao-nav-category>summary>svg,
.ao-body .ao-category-icon,
.ao-body .ao-nav-group>svg:first-child,
.ao-sidebar nav details.ao-nav-category>summary>.ao-category-icon {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

.ao-body .ao-sidebar nav details.ao-nav-category>summary>.ao-category-chevron {
  width: 14px !important;
  height: 14px !important;
}

.ao-body .ao-sidebar-toggle>svg,
.ao-sidebar-toggle>svg {
  width: 20px !important;
  height: 20px !important;
}

.ao-body .ao-site-link>svg,
.ao-site-link>svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

.ao-body .module-system-grid .dashboard-module-icon,
.dashboard-module-icon {
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px !important;
}

/* Estado colapsado / minimizado */
.ao-body .ao-sidebar-collapsed .ao-sidebar nav button>svg,
.ao-sidebar-collapsed .ao-sidebar nav button>svg {
  width: 24px !important;
  height: 24px !important;
}

.ao-body .ao-sidebar-collapsed .ao-site-link>svg,
.ao-sidebar-collapsed .ao-site-link>svg {
  width: 24px !important;
  height: 24px !important;
}

/* Dashboard Gastronomía (ARCAONE-Dashboard) */
.sidebar nav button>svg,
.sidebar nav button svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

.gastro-nav-category>summary>svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

.quick-actions svg,
.dashboard-topbar button svg {
  width: 20px !important;
  height: 20px !important;
}

/* Dashboard Logística (Mandalo) */
.side nav button svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}

#collapse svg {
  width: 20px !important;
  height: 20px !important;
}

/* Optimización Responsive Global de Dashboards */
.ao-panel:has(table),
.ao-table-scroll,
.table-wrap,
.dash-table-wrap,
.order-grid,
.kds-grid {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  max-width: 100% !important;
}

@media(max-width: 760px) {
  .ao-body .ao-sidebar,
  .ao-sidebar {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-height: none !important;
    border-right: 0 !important;
  }
  .ao-body .ao-main,
  .ao-main {
    margin-left: 0 !important;
    padding: 0 4% 35px !important;
  }
  .ao-body .ao-topbar,
  .ao-topbar,
  .dash-header {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  .ao-body .ao-search,
  .ao-search,
  .dash-search {
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }
  .ao-body .ao-page-heading,
  .ao-page-heading {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .ao-body .ao-page-heading .estate-button,
  .ao-page-heading .estate-button {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
  }
  .ao-body .ao-quick-actions,
  .ao-quick-actions {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    flex-wrap: nowrap !important;
    padding-bottom: 6px !important;
    width: 100% !important;
  }
  .ao-body .ao-quick-actions > *,
  .ao-quick-actions > * {
    flex-shrink: 0 !important;
  }
  .ao-body .module-system-grid,
  .module-system-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

@media(max-width: 540px) {
  .ao-body .ao-metrics,
  .ao-metrics,
  .metrics,
  .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .ao-body .ao-metrics article,
  .ao-metrics article,
  .metrics article,
  .stats > div {
    padding: 12px 10px !important;
    min-width: 0 !important;
  }
  .ao-body .ao-metrics strong,
  .ao-metrics strong,
  .metrics strong,
  .stats b {
    font-size: 19px !important;
    letter-spacing: -0.4px !important;
    word-break: break-all !important;
  }
  .ao-body .ao-pipeline,
  .ao-pipeline {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
}

@media(max-width: 360px) {
  .ao-body .ao-metrics,
  .ao-metrics,
  .metrics,
  .stats {
    grid-template-columns: 1fr !important;
  }
}

@media(max-width: 600px) {
  .ao-body #ao-editor,
  #ao-editor,
  dialog {
    width: 95vw !important;
    max-width: 95vw !important;
    padding: 20px 14px !important;
    margin: auto !important;
    border-radius: 12px !important;
  }
  #ao-editor-form input,
  #ao-editor-form textarea,
  #ao-editor-form select {
    font-size: 14px !important;
    min-height: 42px !important;
  }
}

/* Badge Favicon de ArcaOne en el encabezado del sidebar de los Dashboards */
.ao-business-icon,
.ao-business > div {
  grid-row: span 2;
  width: 34px !important;
  height: 34px !important;
  background: #314124 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 5px !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.ao-business > div img,
.ao-business-icon img {
  width: 22px !important;
  height: 22px !important;
  object-fit: contain !important;
  display: block !important;
  margin: auto !important;
}


