/**
 * Skin LevaeDriver — cores da logo
 * Navy: #002038 | Azul: #0060C8 | Branco: #fff
 */

:root {
  --brax-navy: #002038;
  --brax-navy-rgb: 0, 32, 56;
  --brax-blue: #0060C8;
  --brax-blue-rgb: 0, 96, 200;
  --brax-blue-shade: #004A9E;
  --brax-blue-tint: #2E7AD4;
  --brax-white: #ffffff;

  --f7-theme-color: var(--brax-blue);
  --f7-theme-color-rgb: var(--brax-blue-rgb);
  --f7-theme-color-shade: var(--brax-blue-shade);
  --f7-theme-color-tint: var(--brax-blue-tint);
}

:root.theme-dark {
  --f7-theme-color: var(--brax-blue-tint);
  --f7-theme-color-rgb: 46, 122, 212;
  --f7-theme-color-shade: var(--brax-blue);
  --f7-theme-color-tint: #5B96DE;
}

.navbar.tema-primario {
  background: var(--brax-navy);
  margin-bottom: 0;
}

.navbar.tema-secundario {
  background: var(--brax-blue);
  margin-bottom: 0;
}

.block.topo-painel {
  margin: 0;
  padding-top: 40px;
  padding-bottom: 10px;
  background: var(--brax-navy);
  height: 120px;
}

.title {
  text-align: center !important;
  width: 100% !important;
}

:root,
:root.theme-dark,
:root .theme-dark {
  --f7-bars-bg-color: var(--brax-navy);
  --f7-bars-bg-color-rgb: var(--brax-navy-rgb);
  --f7-bars-translucent-opacity: 0.94;
  --f7-bars-text-color: #fff;
  --f7-bars-link-color: #fff;
  --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.85);
  --f7-bars-border-color: transparent;
  --f7-tabbar-link-active-color: #fff;
  --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.54);
  --f7-sheet-border-color: transparent;
  --f7-tabbar-link-active-border-color: #fff;
}

.appbar,
.navbar,
.toolbar,
.subnavbar,
.calendar-header,
.calendar-footer {
  --f7-touch-ripple-color: var(--f7-touch-ripple-white);
  --f7-link-highlight-color: var(--f7-link-highlight-white);
  --f7-button-text-color: #fff;
  --f7-button-pressed-bg-color: rgba(255, 255, 255, 0.1);
}

.navbar-large-transparent,
.navbar-large.navbar-transparent {
  --f7-navbar-large-title-text-color: #000;
  --r: 0;
  --g: 96;
  --b: 200;
  --progress: var(--f7-navbar-large-collapse-progress);
  --f7-bars-link-color: rgb(
    calc(var(--r) + (255 - var(--r)) * var(--progress)),
    calc(var(--g) + (255 - var(--g)) * var(--progress)),
    calc(var(--b) + (255 - var(--b)) * var(--progress))
  );
}

.theme-dark .navbar-large-transparent,
.theme-dark .navbar-large.navbar-transparent {
  --f7-navbar-large-title-text-color: #fff;
}

.tabbar .tab-link-active,
.tabbar-labels .tab-link-active {
  border-top: 2px solid var(--brax-blue) !important;
  font-size: 32px;
}

#link1,
#link2,
#link4,
#link5 {
  border-top: 1px solid var(--brax-blue);
  color: var(--brax-blue);
}

#link1.tab-link-active,
#link2.tab-link-active,
#link4.tab-link-active,
#link5.tab-link-active {
  border-top: 2px solid var(--brax-blue) !important;
}

.special-card {
  background: var(--brax-navy);
  color: white;
}

.button.button-fill,
.button.color-blue,
.fab-buttons a,
.fab > a {
  --f7-button-bg-color: var(--brax-blue);
  --f7-button-pressed-bg-color: var(--brax-blue-shade);
}

.button.button-fill:not(.button-round),
.button.button-outline:not(.button-round),
.button.button-large:not(.button-round) {
  height: 48px;
  min-height: 48px;
  padding: 0 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  line-height: 1;
}

.button.button-fill:not(.button-round):not(.color-red):not(.color-green) {
  background: linear-gradient(135deg, #002038 0%, #0060C8 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 22px rgba(0, 96, 200, .26);
}

.button.button-outline:not(.button-round):not(.color-red) {
  background: #fff !important;
  color: #0060C8 !important;
  border: 1.5px solid rgba(0, 96, 200, .22) !important;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .06);
}

.button.button-fill.color-red,
.button.color-red.button-fill {
  background: linear-gradient(135deg, #9f1239 0%, #dc2626 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 22px rgba(220, 38, 38, .22);
}

.button.button-outline.color-red,
.button.color-red.button-outline {
  background: #fff5f5 !important;
  color: #b91c1c !important;
  border: 1.5px solid rgba(185, 28, 28, .16) !important;
  box-shadow: none;
}

.button.button-fill.color-green,
.button.color-green.button-fill {
  background: linear-gradient(135deg, #166534 0%, #16a34a 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 22px rgba(22, 163, 74, .22);
}

.button.button-small:not(.button-round) {
  height: 38px;
  min-height: 38px;
  padding: 0 14px;
  font-size: 13px;
  border-radius: 999px;
}

.button i,
.button .mdi,
.button .fa-solid {
  font-size: 18px;
  line-height: 1;
}

.segmented .button,
.segmented .button.button-fill,
.segmented .button.button-outline {
  height: auto;
  min-height: 36px;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.segmented .button:first-child { border-radius: 12px 0 0 12px !important; }
.segmented .button:last-child { border-radius: 0 12px 12px 0 !important; }

.button.button-fill.color-navy,
.bg-brax-navy {
  background: var(--brax-navy) !important;
}

.text-brax-blue {
  color: var(--brax-blue) !important;
}

.text-brax-navy {
  color: var(--brax-navy) !important;
}