/**
 * =====================================================================
 * BRANDING CSS — Alesmont
 * Generado automáticamente por scripts/personalize_app.py
 * Para regenerar: python scripts/personalize_app.py --client-name "Alesmont" ...
 * =====================================================================
 */

:root {
  /* === PALETA PRINCIPAL === */
  --brand-primary:        #29AA72;
  --brand-primary-light:  #56D69E;
  --brand-primary-dark:   #1E7F55;

  --brand-accent:         #7ADFB3;
  --brand-accent-light:   #A1E8C9;
  --brand-accent-dark:    #34CE8B;

  --brand-secondary:      #1E8156;
  --brand-secondary-light:#37D08E;
  --brand-secondary-dark: #166040;

  /* === ESTADOS === */
  --brand-success: #22c55e;
  --brand-warning: #f59e0b;
  --brand-error:   #ef4444;
  --brand-info:    #3b82f6;

  /* === NEUTROS === */
  --brand-bg:          #f8fafc;
  --brand-surface:     #ffffff;
  --brand-text-dark:   #1e293b;
  --brand-text-light:  #64748b;
  --brand-border:      #e2e8f0;

  /* === TIPOGRAFÍA === */
  --brand-font: 'Roboto', 'Segoe UI', sans-serif;

  /* === SOMBRAS === */
  --brand-shadow-sm: 0 1px 3px rgba(41, 170, 114, 0.1);
  --brand-shadow-md: 0 4px 16px rgba(41, 170, 114, 0.15);
  --brand-shadow-lg: 0 8px 32px rgba(41, 170, 114, 0.2);

  /* === BORDES === */
  --brand-radius-sm: 6px;
  --brand-radius-md: 10px;
  --brand-radius-lg: 16px;
}

/* ── App bar ── */
.v-app-bar {
  background: white !important;
  border-bottom: 1px solid var(--brand-border) !important;
  box-shadow: var(--brand-shadow-sm) !important;
}

/* ── Navigation drawer ── */
.v-navigation-drawer {
  border-right: 1px solid var(--brand-border) !important;
}

/* ── Vuetify primary color override ── */
.v-btn--variant-flat.bg-primary,
.v-btn[class*="bg-primary"] {
  background: #29AA72 !important;
  color: white !important;
}

/* ── Headings & titles ── */
.text-primary {
  color: #29AA72 !important;
}

/* ── Focus ring ── */
*:focus-visible {
  /*outline: 2px solid #29AA72;
  outline-offset: 2px;*/
}

/* ── Links ── */
a {
  color: #29AA72;
  text-decoration: none;
  transition: color 0.2s;
}

a:hover {
  color: #1E7F55;
}

/* ── Cards: subtle primary border on hover ── */
.v-card:hover {
  box-shadow: var(--brand-shadow-md) !important;
}

/* ── v-data-table headers ── */
.v-data-table thead th {
  background: var(--brand-bg) !important;
  color: #29AA72 !important;
  font-weight: 600;
  border-bottom: 2px solid #7ADFB3;
}

/* ── Gradient utilities ── */
.gradient-primary {
  background: linear-gradient(135deg, #29AA72, #20885B) !important;
}
.gradient-accent {
  background: linear-gradient(135deg, #7ADFB3, #42D193) !important;
}

/* ── Pulse animation ── */
@keyframes brand-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

.brand-pulse {
  animation: brand-pulse 2s ease-in-out infinite;
}

/* ── Scrollbar ── */
::-webkit-scrollbar-thumb {
  background: #56D69E;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #29AA72;
}

/* ── Status badges ── */
.badge-success { background: #dcfce7; color: #166534; }
.badge-warning { background: #fef3c7; color: #92400e; }
.badge-error   { background: #fee2e2; color: #991b1b; }
.badge-info    { background: #dbeafe; color: #1e40af; }

/* ── Responsiveness ── */
@media (max-width: 768px) {
  :root {
    --brand-radius-lg: 10px;
  }
}