/* =========================================================
   Ceneval — Color Palette
   v3.0.0 | 2026-02-22
   Naranja / Navy — estilo Apple
   ========================================================= */

:root {
  --brand-primary: #0a1128;
  --brand-accent: #f28c28;
  --brand-accent-hover: #e07b1a;
  --brand-accent-light: rgba(242, 140, 40, .08);
  --brand-accent-border: rgba(242, 140, 40, .25);
  --brand-dark: #004777;
  --brand-surface: #fbfbfd;
  --brand-text: #1d1d1f;
  --brand-secondary-text: #86868b;
  --brand-border: #d2d2d7;
  --brand-border-light: rgba(0,0,0,.06);
  --brand-link: #0066cc;
  --brand-separator: #d2d2d7;
}

body {
  color: var(--brand-text);
  border-top: solid 3px var(--brand-primary);
}

/* Links */
a:link, a:visited { color: var(--brand-link) }
a.link-dark:link, .link-dark a:link,
a.link-dark:visited, .link-dark a:visited { color: var(--brand-text) }
a.link-light:link, .link-light a:link,
a.link-light:visited, .link-light a:visited { color: #fff }

/* Font color utilities */
.font-white, .font-white h1, .font-white h2, .font-white h3,
.font-white h4, .font-white h5, .font-white h6, .font-white p,
.font-white a, a.font-white,
.fontWhite, .fontWhite h1, .fontWhite h2, .fontWhite h3,
.fontWhite h4, .fontWhite h5, .fontWhite h6, .fontWhite p,
.fontWhite a, a.fontWhite { color: #fff !important }

.font-gray, .font-gray h1, .font-gray h2, .font-gray h3,
.font-gray h4, .font-gray h5, .font-gray h6, .font-gray p,
.font-gray a, a.font-gray { color: var(--brand-secondary-text) !important }

.font-gray-dark, .font-gray-dark h1, .font-gray-dark h2, .font-gray-dark h3,
.font-gray-dark h4, .font-gray-dark h5, .font-gray-dark h6, .font-gray-dark p,
.font-gray-dark a, a.font-gray-dark { color: #6e6e73 !important }

.font-gray-light, .font-gray-light h1, .font-gray-light h2, .font-gray-light h3,
.font-gray-light h4, .font-gray-light h5, .font-gray-light h6, .font-gray-light p,
.font-gray-light a, a.font-gray-light { color: #f5f5f7 !important }

.font-color, .font-color h1, .font-color h2, .font-color h3,
.font-color h4, .font-color h5, .font-color h6, .font-color p,
.font-color a, a.font-color { color: var(--brand-primary) !important }

.font-color-dark, .font-color-dark h1, .font-color-dark h2, .font-color-dark h3,
.font-color-dark h4, .font-color-dark h5, .font-color-dark h6, .font-color-dark p,
.font-color-dark a, a.font-color-dark,
.font-dark, .font-dark h1, .font-dark h2, .font-dark h3,
.font-dark h4, .font-dark h5, .font-dark h6, .font-dark p,
.font-dark a, a.font-dark,
.fontDark, .fontDark h1, .fontDark h2, .fontDark h3,
.fontDark h4, .fontDark h5, .fontDark h6, .fontDark p,
.fontDark a, a.fontDark { color: var(--brand-primary) !important }

.font-color-light, .font-color-light a { color: #d2d2d7 !important }
.font-color-primary, .font-color-primary a { color: var(--brand-primary) !important }
.font-color-secondary, .font-color-secondary a { color: var(--brand-accent) !important }
.font-color-green, .font-color-green a { color: #34c759 !important }
.font-color-blue, .font-color-blue a { color: #0066cc !important }
.font-color-yellow, .font-color-yellow a, .font-color-yellow i { color: #f28c28 !important }
.font-color-orange, .font-color-orange a { color: var(--brand-accent) !important }

/* Backgrounds */
.bg-dark          { background: var(--brand-primary) }
.bg-white         { background: #fff }
.bg-gray          { background: #f5f5f7 }
.bg-gray-gradient { background: linear-gradient(180deg, #fff 0%, #f5f5f7 100%) }
.bg-gray-light    { background: #fbfbfd }
.bg-gray-dark     { background: var(--brand-primary) }
.bg-primary       { background: var(--brand-primary) !important }
.bg-secondary     { background: var(--brand-accent) !important }
.bg-orange        { background: var(--brand-accent) }
.bg-blue          { background: var(--brand-primary) }
.bg-blue-dark     { background: var(--brand-dark) }
.bg-red           { background: #ff3b30 }
.bg-yellow        { background: #ff9500 }
.bg-green         { background: #34c759 }
.bg-green-light   { background: rgba(52,199,89,.12) }

/* Borders */
.border-top, .border-left, .border-right, .border-color, hr {
  border-color: var(--brand-border) !important;
}

/* Buttons */
.btn-secondary, .btn-secondary:link,
.btn-secondary a, .btn-secondary a:link {
  background-color: var(--brand-accent);
  color: #fff !important;
  border-color: var(--brand-accent) !important;
}
.btn-secondary:hover {
  background-color: var(--brand-accent-hover) !important;
}

.btn-primary, .btn-primary:link,
.btn-primary a, .btn-primary a:link {
  background-color: var(--brand-primary);
  color: #fff !important;
  border-color: var(--brand-primary) !important;
}
.btn-primary:hover {
  background-color: #1a2740 !important;
}

a.btn-secondary { color: #fff !important }
a.btn-light     { color: var(--brand-text) !important }
.btn-light      { color: var(--brand-text) !important }

/* Sidebar */
.sidebar a { color: var(--brand-text) }
.sidebar i { color: var(--brand-accent) !important }

.completed { border: solid 1px rgba(52,199,89,.25) !important }

/* Line-left color utilities */
.color-lineleft-green:hover   { border-left-width: 6px }
.color-lineleft-blue:hover    { border-left-width: 6px }
.color-lineleft-yellow:hover  { border-left-width: 6px }
.color-lineleft-purple:hover  { border-left-width: 6px }
.color-lineleft-orange:hover  { border-left-width: 6px }

.color-lineleft-green  { border-left: 3px solid #34c759 }
.color-lineleft-blue   { border-left: 3px solid #0066cc !important }
.color-lineleft-yellow { border-left: 3px solid #ff9500 !important }
.color-lineleft-purple { border-left: 3px solid #af52de !important }
.color-lineleft-orange { border-left: 3px solid var(--brand-accent) !important }
.color-lineleft-greend { border-left: 3px solid #5ac8fa !important }