/* SIEC 0.20 · Identidad visual compartida
   Esta hoja se carga al final para unificar tienda, administración y repartidores. */
:root {
  --siec-green: #357a3e;
  --siec-green-dark: #235b2c;
  --siec-green-soft: #e7f3e4;
  --siec-green-pale: #f5faf4;
  --siec-ink: #17233b;
  --siec-muted: #617064;
  --siec-line: #d7e4d8;
  --siec-surface: #ffffff;
  --siec-canvas: #f7faf7;
  --siec-danger: #b42318;
  --siec-radius: 12px;
  --siec-shadow: 0 10px 30px rgba(27, 69, 35, .09);
}

/* Acciones de cuenta y administración en la cabecera de la tienda. */
.header-actions {
  align-items: center;
  gap: 8px;
}
.header-actions .btn-login,
.header-actions .btn-dashboard,
.header-actions .btn-cart {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 9px;
  font-size: .78rem;
  font-weight: 850;
  white-space: nowrap;
}
.header-actions .btn-login {
  padding: 5px 8px 5px 5px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--siec-ink);
}
.header-actions .btn-login:hover {
  border-color: var(--siec-line);
  background: var(--siec-green-pale);
  color: var(--siec-green-dark);
}
.account-avatar {
  width: 27px;
  height: 27px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: var(--siec-green-soft);
  color: var(--siec-green-dark);
  font-size: .72rem;
  font-weight: 900;
}
.header-actions .btn-dashboard {
  padding: 5px 10px;
  border: 1px solid #88af8b;
  background: #fff;
  color: var(--siec-green-dark);
}
.header-actions .btn-dashboard:hover {
  border-color: var(--siec-green);
  background: var(--siec-green);
  color: #fff;
}
.dashboard-entry-icon {
  display: grid;
  grid-template-columns: repeat(2, 4px);
  gap: 2px;
}
.dashboard-entry-icon i {
  width: 4px;
  height: 4px;
  display: block;
  border-radius: 1px;
  background: currentColor;
}
.header-actions .btn-dashboard::before { content: none; }
.header-actions .btn-cart {
  padding: 5px 10px 5px 12px;
  border: 1px solid var(--siec-green);
  background: var(--siec-green);
  color: #fff;
  box-shadow: none;
}
.header-actions .btn-cart:hover { background: var(--siec-green-dark); }
.header-actions .cart-badge {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: var(--siec-green-dark);
  font-size: .68rem;
}
@media (max-width: 900px) and (min-width: 768px) {
  .header-actions { gap: 4px; }
  .header-actions .btn-login { padding-right: 4px; }
  .header-actions .btn-dashboard,
  .header-actions .btn-cart { padding-inline: 8px; }
}

html { color-scheme: light; }
body { background: var(--siec-canvas); color: var(--siec-ink); }
button, input, select, textarea { font: inherit; }

/* Controles compartidos */
.btn-primary,
.btn-secondary,
.btn-simular,
.auth-primary,
.take-photo-btn,
.confirm-delivery-btn.is-ready,
.route-action,
.offer-accept,
.incident-submit,
.onboarding-next,
.driver-profile-submit,
.one-action button {
  border: 1px solid var(--siec-green) !important;
  background: #fff !important;
  color: var(--siec-green-dark) !important;
  box-shadow: none !important;
}

.btn-primary:hover,
.btn-secondary:hover,
.btn-simular:hover,
.auth-primary:hover,
.take-photo-btn:hover,
.confirm-delivery-btn.is-ready:hover,
.route-action:hover,
.offer-accept:hover,
.incident-submit:hover,
.onboarding-next:hover,
.driver-profile-submit:hover,
.one-action button:hover {
  border-color: var(--siec-green-dark) !important;
  background: var(--siec-green) !important;
  color: #fff !important;
}

.btn-danger { border-color: #dc8f89 !important; background: #fff !important; color: var(--siec-danger) !important; }
.btn-danger:hover { border-color: var(--siec-danger) !important; background: var(--siec-danger) !important; color: #fff !important; }

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea {
  border-color: var(--siec-line) !important;
  background: #fff !important;
  color: var(--siec-ink) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
select:focus,
textarea:focus {
  border-color: var(--siec-green) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(53, 122, 62, .13) !important;
}

input[type="checkbox"], input[type="radio"] { accent-color: var(--siec-green); }

/* Todos los modales de cliente y administración */
.modal,
.delivery-modal {
  background: rgba(20, 47, 27, .46) !important;
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}

.modal-content,
.delivery-modal-card {
  border: 1px solid var(--siec-line) !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: var(--siec-ink) !important;
  box-shadow: 0 24px 65px rgba(20, 47, 27, .2) !important;
}

.modal-content::before,
.delivery-modal-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 18px;
  left: 18px;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: var(--siec-green);
}

.modal-content { position: relative; }
.modal-header { border-bottom-color: var(--siec-line) !important; }
.modal-header h2,
.modal-content h2,
.delivery-modal-card h2 { color: var(--siec-ink) !important; }

.modal-kicker,
.section-kicker,
.delivery-modal-kicker,
.driver-auth-kicker { color: var(--siec-green-dark) !important; }

.modal-close,
.btn-close-modal,
.delivery-modal-close {
  border: 1px solid #74a875 !important;
  background: #fff !important;
  color: var(--siec-green-dark) !important;
}

.modal-close:hover,
.btn-close-modal:hover,
.delivery-modal-close:hover {
  border-color: var(--siec-green) !important;
  background: var(--siec-green) !important;
  color: #fff !important;
}

.modal-footer,
.modal-btns-row,
.delivery-modal-actions { border-top-color: var(--siec-line) !important; }
.auth-form input:focus,
.pqrs-form input:focus,
.pqrs-form select:focus,
.pqrs-form textarea:focus { border-color: var(--siec-green) !important; box-shadow: 0 0 0 3px rgba(53,122,62,.13) !important; }
.modal-sub a, .auth-link, .auth-back { color: var(--siec-green-dark) !important; }
.modal-img, .cart-item, .confirm-section, .bank-info, .upload-area,
.brick-campaign-modal-rule, .brick-campaign-modal-total {
  border-color: var(--siec-line) !important;
  background: var(--siec-green-pale) !important;
}
.cart-summary { border-top-color: var(--siec-line) !important; }
.cart-qty-btn { border: 1px solid var(--siec-line) !important; background: #fff !important; color: var(--siec-green-dark) !important; }
.cart-qty-btn:hover { border-color: var(--siec-green) !important; background: var(--siec-green) !important; color: #fff !important; }
.step.active .step-num, .step.done .step-num { border-color: var(--siec-green) !important; background: var(--siec-green) !important; color: #fff !important; }
.step.active .step-label, .step.done .step-label { color: var(--siec-green-dark) !important; }
.step-line { background: var(--siec-line) !important; }
.toast { border: 1px solid #bcd9bd; background: var(--siec-green-dark) !important; color: #fff !important; box-shadow: var(--siec-shadow); }
.rating-stars label:has(input:checked) { border-color: var(--siec-green) !important; background: var(--siec-green-pale) !important; box-shadow: 0 0 0 3px rgba(53,122,62,.1) !important; }
.order-state { background: var(--siec-green-soft); color: var(--siec-green-dark); }
.pqrs-success { border-color: #a8cea9; background: var(--siec-green-pale); color: var(--siec-green-dark); }
#modalPedidoDetalle .modal-body > div {
  border: 1px solid var(--siec-line);
  border-radius: 12px !important;
  background: var(--siec-green-pale) !important;
}
#modalPedidoDetalle #detTotal { color: var(--siec-green-dark) !important; }
#modalPedidoDetalle thead tr { background: #fff !important; }
#modalPedidoDetalle th { border-bottom-color: var(--siec-line) !important; }

/* Panel administrativo */
.layout { background: var(--siec-canvas); }
.sidebar {
  border-right: 1px solid var(--siec-line);
  background: #fff !important;
  box-shadow: 8px 0 26px rgba(28, 69, 35, .05);
}
.sidebar-logo, .sidebar-logo span { color: var(--siec-ink) !important; }
.sidebar-logo::first-letter { color: var(--siec-green); }
.sidebar-sub { color: var(--siec-muted) !important; }
.sidebar-version { border-color: #b9d5ba !important; background: var(--siec-green-pale) !important; color: var(--siec-green-dark) !important; }
.sidebar-nav-group { color: #7b8a7d !important; }
.nav-btn { border: 1px solid transparent !important; background: #fff !important; color: #314735 !important; }
.nav-btn:hover { border-color: #83ad84 !important; background: var(--siec-green-pale) !important; color: var(--siec-green-dark) !important; }
.nav-btn.active { border-color: var(--siec-green) !important; background: var(--siec-green) !important; color: #fff !important; box-shadow: 0 6px 15px rgba(53,122,62,.15); }
.sidebar-footer { border-top-color: var(--siec-line) !important; }
.btn-volver, .btn-logout { border: 1px solid #78a979 !important; background: #fff !important; color: var(--siec-green-dark) !important; }
.btn-volver:hover, .btn-logout:hover { border-color: var(--siec-green) !important; background: var(--siec-green) !important; color: #fff !important; }
.main-content { background: var(--siec-canvas); }
.topbar, .panel-box, .stat-card, .summary-status-grid button,
.warehouse-metrics article, .inventory-metric, .catalog-manager-card,
.notification-template-card, .settings-card {
  border-color: var(--siec-line) !important;
  background: #fff !important;
  box-shadow: 0 5px 18px rgba(25, 66, 34, .055) !important;
}
.control-center-head, .warehouse-head, .inventory-overview-head {
  border: 1px solid #c8dfc9 !important;
  background: linear-gradient(115deg, #f5faf4, #e3f1e0) !important;
  color: var(--siec-ink) !important;
  box-shadow: none !important;
}
.control-center-head p:not(.section-kicker),
.warehouse-head p:not(.section-kicker),
.inventory-overview-head p { color: var(--siec-muted) !important; }
.control-center-head > span, .warehouse-shift span { border-color: #9fc4a1 !important; color: var(--siec-green-dark) !important; background: #fff !important; }
.stat-icon { border-color: #b6d4b7 !important; background: var(--siec-green-soft) !important; color: var(--siec-green-dark) !important; }
.stat-icon svg { stroke: currentColor !important; }
.warehouse-tab { color: #435846 !important; }
.warehouse-tab:hover { background: var(--siec-green-pale) !important; color: var(--siec-green-dark) !important; }
.warehouse-tab.is-active { background: var(--siec-green) !important; color: #fff !important; box-shadow: none !important; }
.notif-dropdown { border-color: var(--siec-line) !important; box-shadow: var(--siec-shadow) !important; }
.notif-header { background: var(--siec-green-pale) !important; border-bottom-color: var(--siec-line) !important; }
.inventory-movement-product { background: var(--siec-green-pale) !important; color: var(--siec-ink) !important; border: 1px solid var(--siec-line); }
.modal-inline { border-color: var(--siec-line) !important; background: var(--siec-green-pale) !important; }

/* Acceso y operación de repartidores */
.driver-auth-shell { background: var(--siec-canvas); }
.driver-auth-brand {
  border-right: 1px solid var(--siec-line);
  background: linear-gradient(145deg, #fff 0%, #eef7ec 100%) !important;
  color: var(--siec-ink) !important;
}
.driver-auth-brand::after { border-color: rgba(53,122,62,.18) !important; box-shadow: 0 0 0 70px rgba(53,122,62,.035), 0 0 0 140px rgba(53,122,62,.025) !important; }
.driver-auth-logo, .driver-auth-logo span { color: var(--siec-ink) !important; }
.driver-auth-logo span { color: var(--siec-green) !important; }
.driver-auth-brand h1 + p, .driver-auth-benefits { color: #48604c !important; }
.driver-auth-benefits span { background: var(--siec-green) !important; box-shadow: 0 0 0 5px rgba(53,122,62,.11) !important; }
.driver-auth-card { border-color: var(--siec-line) !important; border-radius: 16px !important; box-shadow: var(--siec-shadow) !important; }
.delivery-page { background: var(--siec-canvas); }
.delivery-header {
  border: 1px solid var(--siec-line);
  border-top: 0;
  background: #fff !important;
  color: var(--siec-ink) !important;
  box-shadow: 0 5px 18px rgba(25,66,34,.07) !important;
}
.delivery-role { background: var(--siec-green-soft) !important; color: var(--siec-green-dark) !important; }
.eyebrow { color: var(--siec-green-dark) !important; }
#deliveryLogoutBtn, .availability-toggle, .onboarding-back, .offer-reject, .incident-toggle, .retry-btn {
  border: 1px solid #78a979 !important;
  background: #fff !important;
  color: var(--siec-green-dark) !important;
}
#deliveryLogoutBtn:hover, .availability-toggle:hover, .onboarding-back:hover,
.offer-reject:hover, .incident-toggle:hover, .retry-btn:hover {
  border-color: var(--siec-green) !important;
  background: var(--siec-green) !important;
  color: #fff !important;
}
.delivery-card, .driver-onboarding-card, .driver-delivery-promise,
.driver-history-card, .empty-state, .skeleton-card {
  border-color: var(--siec-line) !important;
  background: #fff !important;
  box-shadow: 0 6px 20px rgba(25,66,34,.065) !important;
}
.driver-delivery-promise { border-left-color: var(--siec-green) !important; }
.availability-status.is-online, .driver-profile-status.is-aprobado { background: var(--siec-green-soft) !important; color: var(--siec-green-dark) !important; }
.onboarding-progress span.is-active { background: var(--siec-green) !important; color: #fff !important; }
.signature-canvas, .zona-firma, .driver-profile-signature { border-color: var(--siec-line) !important; background: var(--siec-green-pale) !important; }
.offer-card { border-color: var(--siec-green) !important; }
.total-valor { color: var(--siec-green-dark) !important; }

/* Repartidores y calificaciones del panel: misma línea visual de la tienda */
.delivery-operations-head,
.ratings-admin-head {
  border: 1px solid var(--siec-line) !important;
  border-radius: 18px;
  background: linear-gradient(118deg, #fff 0%, #eff8ee 100%) !important;
  color: var(--siec-ink) !important;
  box-shadow: 0 6px 18px rgba(25, 66, 34, .055);
}
.delivery-operations-head h2,
.ratings-admin-head h2 { color: var(--siec-ink) !important; }
.delivery-operations-head p:not(.section-kicker),
.ratings-admin-head p:not(.section-kicker) { color: var(--siec-muted) !important; }
.delivery-operations-head .section-kicker,
.ratings-admin-head .section-kicker { color: var(--siec-green-dark) !important; }
.delivery-operations-metrics span {
  border: 1px solid #cfe2d1 !important;
  border-radius: 999px;
  background: #fff !important;
  color: var(--siec-green-dark) !important;
}
.delivery-team-card {
  border: 1px solid var(--siec-line) !important;
  border-top: 4px solid #b8d9bb !important;
  background: #fff !important;
  box-shadow: 0 5px 16px rgba(25, 66, 34, .06) !important;
  opacity: 1 !important;
}
.delivery-team-card.is-online { border-top-color: var(--siec-green) !important; }
.delivery-team-card.is-busy { border-top-color: #78a979 !important; background: #fbfefb !important; }
.delivery-team-card.is-warning { border-top-color: #c89b22 !important; background: #fffdf5 !important; }
.delivery-team-card.is-offline { border-top-color: #c8d2c9 !important; background: #fafcfb !important; }
.delivery-avatar { background: var(--siec-green-soft) !important; color: var(--siec-green-dark) !important; }
.delivery-team-card h3,
.delivery-team-card dd { color: var(--siec-ink) !important; }
.delivery-team-card dl div { background: #f7fbf7 !important; }
.delivery-team-card dt,
.delivery-current-order { color: var(--siec-muted) !important; }
.delivery-state.is-online,
.delivery-current-order.is-free { color: var(--siec-green-dark) !important; }
.delivery-state.is-busy { color: #427549 !important; }
.delivery-state.is-warning { background: transparent !important; color: #80620b !important; }
.delivery-state.is-offline { color: #718073 !important; }
.delivery-view-order,
.driver-review-documents a {
  border-color: #78a979 !important;
  color: var(--siec-green-dark) !important;
  background: #fff !important;
}
.delivery-view-order:hover,
.driver-review-documents a:hover { background: var(--siec-green) !important; color: #fff !important; }
.driver-review-panel,
.ratings-admin-head + .ratings-admin-metrics + .panel-box { border-color: var(--siec-line) !important; }
.driver-review-help,
.table-subline,
.driver-review-summary span,
.driver-review-summary small,
.driver-review-owner,
.driver-review-privacy,
.driver-review-previous,
.driver-review-decision label { color: var(--siec-muted) !important; }
.driver-review-summary article,
.driver-review-owner,
.driver-review-previous { border-color: var(--siec-line) !important; background: #f7fbf7 !important; }
.driver-review-summary strong { color: var(--siec-ink) !important; }
.driver-review-privacy { border-left-color: #c89b22 !important; background: #fffdf5 !important; }
.driver-review-panel select,
.driver-review-decision textarea { border-color: var(--siec-line) !important; background: #fff !important; color: var(--siec-ink) !important; }
.ratings-admin-metrics article {
  border-color: var(--siec-line) !important;
  background: #fff !important;
  box-shadow: 0 4px 14px rgba(25, 66, 34, .045);
}
.ratings-admin-metrics span { color: var(--siec-muted) !important; }
.ratings-admin-metrics strong { color: var(--siec-ink) !important; }
.ratings-admin-metrics .is-alert { border-color: #ead38c !important; background: #fffdf5 !important; }
.ratings-admin-metrics .is-alert strong { color: #8a6500 !important; }
.rating-stars-static { color: #af850d !important; }
.rating-opinion { color: #415845 !important; }

@media (max-width: 800px) {
  .driver-auth-brand { border-right: 0; border-bottom: 1px solid var(--siec-line); }
  .dashboard-mobile-menu-btn { border: 1px solid var(--siec-green) !important; background: #fff !important; }
  .dashboard-mobile-menu-btn span { background: var(--siec-green) !important; }
  .dashboard-menu-backdrop { background: rgba(20,47,27,.38) !important; }
}

@media (max-width: 600px) {
  .modal, .delivery-modal { align-items: flex-end !important; padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)) !important; }
  .modal-content, .delivery-modal-card { width: 100% !important; max-height: calc(100dvh - 16px) !important; border-radius: 18px 18px 10px 10px !important; }
  .modal-footer, .modal-btns-row, .delivery-modal-actions, .logout-actions, .pqrs-actions, .checkout-actions-row { display: grid !important; grid-template-columns: 1fr !important; }
  .modal-footer button, .modal-btns-row button, .delivery-modal-actions button, .logout-actions button, .pqrs-actions button, .checkout-actions-row button { width: 100%; min-height: 46px; }
}
