/* Vive Centro active theme: Editorial Night. */
:root {
  color-scheme: light;
  --brand-primary: #a95033;
  --brand-secondary: #253b55;
  --brand-success: #32845a;
  --brand-warning: #a96f16;
  --brand-danger: #b74742;
  --primary: var(--brand-primary);
  --primary-foreground: #ffffff;
  --secondary: var(--brand-secondary);
  --secondary-foreground: #ffffff;
  --success: var(--brand-success);
  --success-foreground: #ffffff;
  --warning: var(--brand-warning);
  --warning-foreground: #ffffff;
  --danger: var(--brand-danger);
  --danger-foreground: #ffffff;
  --background: #f5f0e7;
  --surface: #fffcf6;
  --surface-subtle: #faf5ec;
  --surface-control: #f1eadf;
  --surface-floating: #fffdf8;
  --foreground: #182331;
  --surface-foreground: var(--foreground);
  --muted-foreground: #68717a;
  --icon-foreground: #596574;
  --header-foreground: var(--foreground);
  --border: #ded5c8;
  --border-faint: #ebe4da;
  --control-background: var(--surface-control);
  --control-background-hover: #e9dfd2;
  --control-background-disabled: #e8e3dc;
  --control-background-readonly: #eee7dd;
  --control-border: #d4c9bb;
  --control-border-hover: #bfb2a1;
  --control-placeholder: #8b8f91;
  --neutral-surface: #ece5db;
  --control-off-surface: #e7e1d9;
  --icon-surface: color-mix(in srgb, var(--primary) 11%, white);
  --text-soft: rgb(24 35 49 / 76%);
  --text-subtle: rgb(24 35 49 / 66%);
  --text-muted: rgb(24 35 49 / 60%);
  --text-faint: rgb(24 35 49 / 46%);
  --muted-text-soft: rgb(104 113 122 / 78%);
  --primary-soft: color-mix(in srgb, var(--primary) 11%, white);
  --primary-border: color-mix(in srgb, var(--primary) 24%, white);
  --primary-surface: color-mix(in srgb, var(--primary) 8%, var(--background));
  --primary-focus: color-mix(in srgb, var(--primary) 22%, transparent);
  --category-accent: #9a7a3f;
  --category-accent-soft: color-mix(in srgb, var(--category-accent) 12%, white);
  --overlay-scrim: rgb(18 24 34 / 34%);
  --sidebar: #17283b;
  --sidebar-foreground: #f7f0e4;
  --shadow-sm: 0 4px 12px rgb(35 26 18 / 6%);
  --shadow-md: 0 10px 26px rgb(35 26 18 / 9%);
  --shadow-lg: 0 20px 46px rgb(35 26 18 / 14%);
  --shadow-dropdown: 0 18px 38px rgb(35 26 18 / 14%);
  --shadow-toast: 0 18px 38px rgb(35 26 18 / 16%);
  --radius-sm: 0.75rem;
  --radius-md: 0.9rem;
  --radius-lg: 1.1rem;
  --font-family: "Aptos", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --guvia-primary-rgb: 169, 80, 51;
  --guvia-primary-foreground-rgb: 255, 255, 255;
  --guvia-secondary-rgb: 37, 59, 85;
  --guvia-secondary-foreground-rgb: 255, 255, 255;
  --guvia-success-rgb: 50, 132, 90;
  --guvia-success-foreground-rgb: 255, 255, 255;
  --guvia-warning-rgb: 169, 111, 22;
  --guvia-warning-foreground-rgb: 255, 255, 255;
  --guvia-danger-rgb: 183, 71, 66;
  --guvia-danger-foreground-rgb: 255, 255, 255;
  --guvia-background-rgb: 245, 240, 231;
  --guvia-foreground-rgb: 24, 35, 49;
  --guvia-surface-rgb: 255, 252, 246;
  --guvia-muted-foreground-rgb: 104, 113, 122;
}

ion-app {
  color-scheme: dark;
  --primary: #c96f4b;
  --primary-foreground: #25130d;
  --secondary: #b79a5c;
  --secondary-foreground: #21190b;
  --success: #72b58f;
  --success-foreground: #071b13;
  --warning: #d5a85c;
  --warning-foreground: #241906;
  --danger: #df7a73;
  --danger-foreground: #280b09;
  --background: #0b1220;
  --surface: #142131;
  --surface-subtle: #19293a;
  --surface-control: #213345;
  --surface-floating: rgb(20 33 49 / 96%);
  --foreground: #f5eddf;
  --surface-foreground: #f5eddf;
  --muted-foreground: #cbc2b4;
  --icon-foreground: #b8b4ad;
  --header-foreground: #f5eddf;
  --border: rgb(245 237 223 / 14%);
  --border-faint: rgb(245 237 223 / 8%);
  --control-background: #213345;
  --control-background-hover: #293e52;
  --control-background-disabled: #252c35;
  --control-background-readonly: #1b2a3a;
  --control-border: rgb(245 237 223 / 18%);
  --control-border-hover: rgb(245 237 223 / 30%);
  --control-placeholder: #978f86;
  --neutral-surface: #1c2c3e;
  --control-off-surface: #182636;
  --icon-surface: #22364a;
  --text-soft: rgb(245 237 223 / 78%);
  --text-subtle: rgb(245 237 223 / 68%);
  --text-muted: rgb(245 237 223 / 58%);
  --text-faint: #767c80;
  --muted-text-soft: rgb(203 194 180 / 78%);
  --primary-soft: rgb(201 111 75 / 18%);
  --primary-border: rgb(201 111 75 / 42%);
  --primary-surface: rgb(201 111 75 / 13%);
  --primary-glow: rgb(201 111 75 / 16%);
  --primary-focus: rgb(225 138 99 / 28%);
  --primary-text-soft: #d98a68;
  --primary-text: #dc8966;
  --primary-text-strong: #df8b67;
  --primary-text-bold: #e18a63;
  --primary-shadow-sm: 0 8px 18px rgb(61 24 12 / 24%);
  --primary-shadow-fab: 0 8px 24px rgb(102 42 20 / 42%);
  --primary-shadow-fab-active: 0 3px 12px rgb(102 42 20 / 34%);
  --secondary-soft: rgb(183 154 92 / 14%);
  --secondary-soft-strong: rgb(183 154 92 / 20%);
  --secondary-border: rgb(183 154 92 / 34%);
  --secondary-border-strong: rgb(183 154 92 / 66%);
  --danger-soft: rgb(223 122 115 / 17%);
  --danger-surface-subtle: rgb(223 122 115 / 12%);
  --danger-text: #ec9c95;
  --overlay-scrim: rgb(3 7 14 / 66%);
  --category-accent: #b79a5c;
  --category-accent-soft: rgb(183 154 92 / 16%);
  --shadow-sm: 0 6px 16px rgb(2 7 15 / 18%);
  --shadow-md: 0 16px 36px rgb(2 7 15 / 24%);
  --shadow-lg: 0 22px 56px rgb(2 7 15 / 42%);
  --shadow-dropdown: 0 20px 48px rgb(2 7 15 / 38%);
  --shadow-toast: 0 18px 42px rgb(2 7 15 / 38%);
  --mobile-canvas: #0b1220;
  --mobile-canvas-elevated: #101a29;
  --mobile-surface-1: #142131;
  --mobile-surface-2: #19293a;
  --mobile-surface-3: #1c2c3e;
  --mobile-surface-search: rgb(18 31 47 / 94%);
  --mobile-surface-tabbar: rgb(8 15 27 / 96%);
  --mobile-surface-floating: rgb(20 33 49 / 96%);
  --mobile-text-primary: #f5eddf;
  --mobile-text-secondary: #cbc2b4;
  --mobile-text-muted: #978f86;
  --mobile-icon-primary: #f5eddf;
  --mobile-icon-secondary: #b8b4ad;
  --mobile-icon-accent: #e18a63;
  --mobile-border-subtle: rgb(245 237 223 / 9%);
  --mobile-border-default: rgb(245 237 223 / 16%);
  --mobile-border-strong: rgb(245 237 223 / 30%);
  --mobile-accent-primary: #c96f4b;
  --mobile-accent-strong: #d67d57;
  --mobile-accent-deep: #e18a63;
  --mobile-accent-soft: rgb(201 111 75 / 18%);
  --mobile-accent-secondary: #b79a5c;
  --mobile-danger: #df7a73;
  --mobile-danger-border: rgb(223 122 115 / 46%);
  --mobile-danger-soft: rgb(223 122 115 / 17%);
  --mobile-tabs-foreground: #a9a79f;
  --mobile-tabs-active: #e18a63;
  --mobile-tabs-border: rgb(245 237 223 / 10%);
  --mobile-tabs-shadow: 0 -14px 34px rgb(2 7 15 / 34%);
  --mobile-elevation-card: 0 16px 36px rgb(2 7 15 / 24%);
  --mobile-elevation-hero: 0 20px 46px rgb(2 7 15 / 32%);
  --mobile-elevation-floating: 0 10px 26px rgb(2 7 15 / 28%);
  --mobile-elevation-tab-dock: var(--mobile-tabs-shadow);
  --map-popup-background: rgb(20 33 49 / 96%);
  --map-popup-foreground: #f5eddf;
  --map-control-background: rgb(18 31 47 / 92%);
  --map-control-foreground: #f5eddf;
  --map-marker-color: #c96f4b;
  --map-marker-selected: #b79a5c;
  --map-cluster: #c96f4b;
  --map-cluster-foreground: #25130d;
  --map-empty-background: #101a29;
  --loading-shimmer-background: linear-gradient(90deg, #1c2c3e, #24384b, #1c2c3e);
  --guvia-brand-icon-keyline-color: rgb(225 138 99 / 28%);
  --guvia-primary-rgb: 201, 111, 75;
  --guvia-primary-foreground-rgb: 37, 19, 13;
  --guvia-secondary-rgb: 183, 154, 92;
  --guvia-secondary-foreground-rgb: 33, 25, 11;
  --guvia-success-rgb: 114, 181, 143;
  --guvia-success-foreground-rgb: 7, 27, 19;
  --guvia-warning-rgb: 213, 168, 92;
  --guvia-warning-foreground-rgb: 36, 25, 6;
  --guvia-danger-rgb: 223, 122, 115;
  --guvia-danger-foreground-rgb: 40, 11, 9;
  --guvia-background-rgb: 11, 18, 32;
  --guvia-foreground-rgb: 245, 237, 223;
  --guvia-surface-rgb: 20, 33, 49;
  --guvia-muted-foreground-rgb: 203, 194, 180;
  --preset-canvas-gradient: linear-gradient(180deg, #101827 0%, #0b1220 42%, #09111e 100%);
  --preset-card-gradient: linear-gradient(160deg, #19293a, #142131);
  --preset-detail-gradient: linear-gradient(180deg, rgb(201 111 75 / 10%) 0, #142131 15rem);
  --preset-detail-photo-overlay: linear-gradient(180deg, transparent 54%, rgb(20 33 49 / 54%) 79%, #142131 100%);
  --preset-floating-shadow: 0 10px 26px rgb(2 7 15 / 28%);
  --preset-disabled-background: #252c35;
  --preset-disabled-foreground: #767c80;
}

ion-app { background: var(--preset-canvas-gradient); }
ion-app ion-content::part(background) { background: var(--preset-canvas-gradient); }
ion-app .mobile-media-card { background: var(--preset-card-gradient); }
ion-app .top-overlay .search-shell,
ion-app .top-overlay .filter-button,
ion-app .top-overlay .overlay-nav-button,
ion-app .top-overlay .state-card { box-shadow: var(--preset-floating-shadow); }
ion-app .auth-screen {
  --background: radial-gradient(circle at 50% 4%, rgb(201 111 75 / 13%), transparent 34%), var(--preset-canvas-gradient);
}
ion-app ion-button.login-submit-button[disabled],
ion-app ion-button.login-submit-button.button-disabled {
  --background: var(--preset-disabled-background);
  --background-hover: var(--preset-disabled-background);
  --background-activated: var(--preset-disabled-background);
  --color: var(--preset-disabled-foreground);
  --box-shadow: none;
  opacity: 1;
}
ion-modal.marker-detail-modal::part(content) { background: var(--preset-detail-gradient); }
ion-modal.marker-detail-modal app-marker-detail-content .hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--preset-detail-photo-overlay);
  pointer-events: none;
}
ion-modal.marker-detail-modal app-marker-detail-content .sheet-heading h2 {
  color: var(--mobile-text-primary, var(--foreground));
  letter-spacing: -0.045em;
}
ion-modal.marker-detail-modal app-marker-detail-content .tag-chip {
  border-color: var(--mobile-border-subtle, var(--border));
  background: var(--mobile-surface-3, var(--surface-control));
  color: var(--mobile-text-secondary, var(--muted-foreground));
}

/* Vive Centro-only persistent showroom notice. Not part of reusable presets. */
ion-app .leaflet-container::after {
  content: "DEMO \00B7  establecimientos ficticios";
  position: absolute;
  left: 12px;
  bottom: 34px;
  z-index: 850;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, #c96f4b 48%, white);
  border-radius: 999px;
  background: rgb(255 252 246 / 93%);
  color: #182331;
  box-shadow: 0 3px 10px rgb(11 18 32 / 18%);
  font: 700 11px/1.15 var(--font-family);
  letter-spacing: 0.02em;
  pointer-events: none;
}