/*
  SYNOPSIS:
    (from within project root directory)
      sassc scss/main.scss public/css/style.css
*/
/* Base CSS Variables */
:root {
  --background-color: #fff;
  --text-color: #000;
  --hover-text-color: #555;
  --hover-bg-color: #eee;
  --accent-color: #3498db;
  --divider-color: #e5e5e5;
  --current-day-bg: #ffcdd2;
  --calendar-cell-bg: #f5f7f8;
  --leave-cell-bg: #9fbb58;
  --leave-cell-color: #61686b;
  --secondary-background-color: #f8f9fa;
  --button-bg: #3498db;
  --button-text: #ffffff;
  --button-hover-bg: #2980b9;
  --link-hover-color: #2980b9;
}

/* Theme: Day (Light) - Clean white with blue accents */
body.theme-day {
  --background-color: #ffffff;
  --text-color: #1a1a1a;
  --hover-bg-color: #f0f0f0;
  --hover-text-color: #000000;
  --accent-color: #2563eb;
  --divider-color: #e5e7eb;
  --calendar-cell-bg: #f9fafb;
  --leave-cell-bg: #10b981;
  --current-day-bg: #fbbf24;
  --secondary-background-color: #f3f4f6;
  --leave-cell-color: #ffffff;
  --button-bg: #2563eb;
  --button-text: #ffffff;
  --button-hover-bg: #1d4ed8;
  --link-hover-color: #1d4ed8;
}

body.theme-deko {
  /* Deko Basic */
  --background-color: #fbf9f6;
  --text-color: #183c0f;
  /* Hover */
  --hover-bg-color: #4fc517;
  --hover-text-color: #183c0f;
  /* Deko Apple */
  --accent-color: #4fc517;
  /* Borders */
  --divider-color: #e5e2dc;
  /* Calendar */
  --calendar-cell-bg: #ffffff;
  --leave-cell-bg: #4fc517;
  --current-day-bg: #c2faa8;
  --secondary-background-color: #85f451;
  --leave-cell-color: #183c0f;
  /* Buttons */
  --button-bg: #4fc517;
  --button-text: #183c0f;
  --button-hover-bg: #85f451;
  /* Links */
  --link-hover-color: #4fc517;
}

/* Theme: Night (Dark) - Deep dark with green accents */
body.theme-night {
  --background-color: #0f172a;
  --text-color: #e2e8f0;
  --hover-bg-color: #1e293b;
  --hover-text-color: #ffffff;
  --accent-color: #22c55e;
  --divider-color: #334155;
  --calendar-cell-bg: #1e293b;
  --current-day-bg: #7c3aed;
  --secondary-background-color: #1e293b;
  --leave-cell-bg: #22c55e;
  --leave-cell-color: #0f172a;
  --button-bg: #22c55e;
  --button-text: #0f172a;
  --button-hover-bg: #16a34a;
  --link-hover-color: #4ade80;
}

/* Theme: Ocean - Deep blue ocean theme */
body.theme-ocean {
  --background-color: #001f3f;
  --text-color: #b8e6ff;
  --hover-bg-color: #003d7a;
  --hover-text-color: #ffffff;
  --accent-color: #00a8ff;
  --divider-color: #0056b3;
  --calendar-cell-bg: #003366;
  --current-day-bg: #00d4ff;
  --secondary-background-color: #002855;
  --leave-cell-bg: #0077be;
  --leave-cell-color: #ffffff;
  --button-bg: #00a8ff;
  --button-text: #001f3f;
  --button-hover-bg: #0088cc;
  --link-hover-color: #00d4ff;
}

/* Theme: Nature - Fresh green forest theme */
body.theme-nature {
  --background-color: #f0fdf4;
  --text-color: #14532d;
  --hover-bg-color: #86efac;
  --hover-text-color: #052e16;
  --accent-color: #16a34a;
  --divider-color: #bbf7d0;
  --calendar-cell-bg: #dcfce7;
  --current-day-bg: #22c55e;
  --secondary-background-color: #dcfce7;
  --leave-cell-bg: #4ade80;
  --leave-cell-color: #052e16;
  --button-bg: #16a34a;
  --button-text: #ffffff;
  --button-hover-bg: #15803d;
  --link-hover-color: #15803d;
}

/* Theme: Volcano - Fiery red-orange theme */
body.theme-volcano {
  --background-color: #2d1b1b;
  --text-color: #ffb3a0;
  --hover-bg-color: #8b2e16;
  --hover-text-color: #ffffff;
  --accent-color: #f97316;
  --divider-color: #7c2d12;
  --calendar-cell-bg: #431407;
  --current-day-bg: #ea580c;
  --secondary-background-color: #431407;
  --leave-cell-bg: #f97316;
  --leave-cell-color: #2d1b1b;
  --button-bg: #f97316;
  --button-text: #2d1b1b;
  --button-hover-bg: #ea580c;
  --link-hover-color: #fb923c;
}

/* Theme: Neon - Bright vibrant neon colors */
body.theme-neon {
  --background-color: #0a0a0a;
  --text-color: #00ff88;
  --hover-bg-color: #1a1a2e;
  --hover-text-color: #00ff88;
  --accent-color: #ff00ff;
  --divider-color: #00ffff;
  --calendar-cell-bg: #16213e;
  --current-day-bg: #ff00ff;
  --secondary-background-color: #0f3460;
  --leave-cell-bg: #00ff88;
  --leave-cell-color: #0a0a0a;
  --button-bg: #ff00ff;
  --button-text: #0a0a0a;
  --button-hover-bg: #ff00cc;
  --link-hover-color: #00ffff;
}

/* Theme: Cyberpunk - Dark futuristic with neon pink/cyan */
body.theme-cyberpunk {
  --background-color: #0d1117;
  --text-color: #c9d1d9;
  --hover-bg-color: #161b22;
  --hover-text-color: #f0f6fc;
  --accent-color: #ff79c6;
  --divider-color: #30363d;
  --calendar-cell-bg: #161b22;
  --current-day-bg: #bd93f9;
  --secondary-background-color: #21262d;
  --leave-cell-bg: #50fa7b;
  --leave-cell-color: #0d1117;
  --button-bg: #ff79c6;
  --button-text: #0d1117;
  --button-hover-bg: #ff6bb5;
  --link-hover-color: #8be9fd;
}

/* Base styles and variables */
body {
  font: 14px "Open Sans", Helvetica, Arial, sans-serif;
  color: var(--text-color);
  background-color: var(--background-color);
  padding-top: 20px;
  padding-bottom: 20px;
}

a {
  color: var(--accent-color);
  transition: color 0.2s ease;
}
a:hover, a:focus {
  color: var(--link-hover-color);
  text-decoration: none;
}

/* Typography */
.text-bigger {
  font-size: 16px;
}

/* Spacing */
.no-bottom-space {
  margin-bottom: 0px;
}

.large-bottom-space {
  margin-bottom: 300px;
}

.form-group {
  margin-bottom: 20px;
}
.form-group .help-block {
  font-style: italic;
}

/* Progress bars */
.progress.bigger {
  height: 38px;
}
.progress.bigger .progress-bar {
  line-height: 38px;
}

/* Labels */
.label.label-plain {
  font-weight: normal;
}

.label.bigger {
  font-size: large;
}

/* Breadcrumbs */
.breadcrumb {
  background: none;
  padding-right: 0;
  padding-left: 0;
}

/* Header */
.header h3 {
  padding-bottom: 19px;
  margin-top: 0;
  margin-bottom: 0;
  line-height: 40px;
}

/* Footer */
.footer {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--divider-color);
}

:root {
  --app-fixed-footer-height: 3.25rem;
  --app-cookie-banner-height: 5.5rem;
}

body:has(.custom-footer) {
  padding-bottom: var(--app-fixed-footer-height);
}

.footer.custom-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1040;
  margin-top: 0;
  padding: 0.625rem 0;
  background-color: var(--background-color);
  border-top: 1px solid var(--divider-color);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.08);
  color: var(--text-color);
}

body.cookie-consent-banner-visible .footer.custom-footer {
  bottom: var(--app-cookie-banner-height);
}

.custom-footer__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
}

.custom-footer__links,
.custom-footer__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  font-size: 0.9rem;
}

.custom-footer__sep {
  color: var(--divider-color);
  user-select: none;
}

.custom-footer__notice {
  margin: 0;
}

.custom-footer__icons {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  margin-left: 0.25rem;
}

.custom-footer__icons a {
  color: var(--text-color);
  opacity: 0.85;
}

.custom-footer__icons a:hover,
.custom-footer__icons a:focus {
  opacity: 1;
  color: var(--hover-text-color);
}

@media (max-width: 767px) {
  :root {
    --app-fixed-footer-height: 6.75rem;
  }
  .custom-footer__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .custom-footer__links,
  .custom-footer__meta {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
  }
  .custom-footer__sep {
    display: none;
  }
  .custom-footer__links > span:first-child {
    display: block;
  }
  .custom-footer__meta {
    gap: 0.5rem;
  }
  .custom-footer__notice {
    line-height: 1.35;
  }
  .custom-footer__icons {
    margin-left: 0;
  }
}
/* Popovers */
.popover {
  min-width: 300px;
  background-color: var(--background-color);
  color: var(--text-color);
  border-color: var(--divider-color);
}
.popover .popover-title {
  background-color: var(--secondary-background-color);
  color: var(--text-color);
  border-bottom: 1px solid var(--divider-color);
}
.popover .popover-content {
  background-color: var(--background-color);
  color: var(--text-color);
}
.popover.top > .arrow {
  border-top-color: var(--divider-color);
}
.popover.top > .arrow:after {
  border-top-color: var(--background-color);
}
.popover.right > .arrow {
  border-right-color: var(--divider-color);
}
.popover.right > .arrow:after {
  border-right-color: var(--background-color);
}
.popover.bottom > .arrow {
  border-bottom-color: var(--divider-color);
}
.popover.bottom > .arrow:after {
  border-bottom-color: var(--background-color);
}
.popover.left > .arrow {
  border-left-color: var(--divider-color);
}
.popover.left > .arrow:after {
  border-left-color: var(--background-color);
}

/* Calendar styles */
.calendar_month {
  width: 100%;
}
.calendar_month td {
  background-color: var(--calendar-cell-bg);
  text-align: center;
  padding-top: 5px;
  padding-bottom: 5px;
}
.calendar_month thead {
  text-align: center;
  font-weight: bolder;
}

div.month_container {
  height: 250px;
}

.team-view-table {
  width: 100%;
}
.team-view-table td {
  padding-top: 5px;
  padding-bottom: 5px;
}

td.team-view-header {
  height: 43px;
  text-align: center;
}

td.calendar_cell {
  width: 15px !important;
  min-width: 15px !important;
  max-width: 15px !important;
  position: relative;
  text-align: center;
  padding-top: 5px;
  padding-bottom: 5px;
}
td.calendar_cell span {
  position: relative;
  left: 9px;
  top: -1px;
  display: block;
  text-align: center;
  z-index: 10;
}

td.current_day_cell {
  background: var(--current-day-bg);
  color: var(--text-color);
}

td.weekend_cell {
  background: var(--secondary-background-color);
}

td.bank_holiday_cell {
  background: var(--accent-color);
  color: var(--text-color);
}

td.leave_cell {
  background: var(--leave-cell-bg);
  color: var(--leave-cell-color);
  font-weight: bolder;
}

td.leave_cell_pended {
  background: #ffcba4;
  color: var(--text-color);
  font-weight: bolder;
}

/* Modals */
.modal-dialog {
  max-width: 450px;
}

/* Truncation */
.left-column-cell {
  text-overflow: ellipsis;
  width: 165px;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}

/* Headers */
.main-row_header {
  border: none;
  font-weight: normal;
  color: #5ba4e5;
  letter-spacing: -0.01em;
  font-size: 19px;
  line-height: 1.15em;
  text-align: left;
  padding-top: 30px;
  padding-bottom: 30px;
}

/* Feeds */
.feed-calendar-big {
  font-size: 450px;
  color: #f8f8f8;
}

.feed-calendar-big-picture-holder {
  text-align: center;
}

p.description-paragraph {
  padding-top: 20px;
  padding-left: 15px;
}

div.feeds-holder {
  margin-top: 20px;
}

/* Leave type statistics */
.top-leave-type-statistics {
  text-align: center;
}
.top-leave-type-statistics dt {
  font-size: 75px;
  color: #61686b;
  font-weight: 100;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 20px;
}
.top-leave-type-statistics dd {
  font-size: 16px;
}

/* Allowance breakdown styling */
.allowance-breakdown {
  text-align: center;
  margin-bottom: 20px;
}

.big-number-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
}

.big-number {
  font-size: 70px !important;
  color: #61686b !important;
  font-weight: 100 !important;
  line-height: 0.8 !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
}
.big-number.negative {
  color: #d9534f !important;
  text-shadow: 0 4px 8px rgba(217, 83, 79, 0.4) !important;
}

/* Extra specific selectors to override any conflicting styles */
.allowance-breakdown .big-number-container .big-number {
  font-size: 70px !important;
  color: #61686b !important;
  font-weight: 100 !important;
  line-height: 0.8 !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
}

.allowance-breakdown .big-number-container .big-number.negative {
  color: #d9534f !important;
  text-shadow: 0 4px 8px rgba(217, 83, 79, 0.4) !important;
}

/* Even more specific selectors */
body .allowance-breakdown .big-number-container .big-number {
  font-size: 70px !important;
  color: #61686b !important;
  font-weight: 100 !important;
  line-height: 0.8 !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
}

body .allowance-breakdown .big-number-container .big-number.negative {
  color: #d9534f !important;
  text-shadow: 0 4px 8px rgba(217, 83, 79, 0.4) !important;
}

.slash {
  font-size: 60px !important;
  color: #61686b !important;
  font-weight: 200 !important;
  line-height: 0.8 !important;
  opacity: 0.7 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Extra specific selector for slash */
.allowance-breakdown .big-number-container .slash {
  font-size: 60px !important;
  color: #61686b !important;
  font-weight: 200 !important;
  line-height: 0.8 !important;
  opacity: 0.7 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Even more specific selector for slash */
body .allowance-breakdown .big-number-container .slash {
  font-size: 60px !important;
  color: #61686b !important;
  font-weight: 200 !important;
  line-height: 0.8 !important;
  opacity: 0.7 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
}

.small-labels {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 8px;
}

.label-vac,
.label-per {
  font-size: 18px;
  color: #888;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  background: #f8f9fa;
  padding: 4px 12px;
  border-radius: 4px;
  border: 1px solid #e9ecef;
}

/* Alternative table layout for allowance breakdown */
.allowance-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.allowance-table th {
  background: #f8f9fa;
  color: #495057;
  font-weight: 600;
  padding: 15px;
  text-align: center;
  border-bottom: 2px solid #dee2e6;
  font-size: 16px;
}
.allowance-table td {
  padding: 20px 15px;
  text-align: center;
  border-bottom: 1px solid #dee2e6;
  font-size: 18px;
  font-weight: 500;
}
.allowance-table .vacation-cell {
  background: #e3f2fd;
  color: #1976d2;
}
.allowance-table .vacation-cell.negative {
  background: #ffebee;
  color: #d32f2f;
}
.allowance-table .personal-cell {
  background: #f3e5f5;
  color: #7b1fa2;
}
.allowance-table .personal-cell.negative {
  background: #ffebee;
  color: #d32f2f;
}
.allowance-table .big-number-table {
  font-size: 60px !important;
  font-weight: 100 !important;
  line-height: 1 !important;
  margin: 0 !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

.secondary-leave-type-statistics {
  font-size: 16px;
}
.secondary-leave-type-statistics dt {
  text-align: center;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #e5e5e5;
}
.secondary-leave-type-statistics dd {
  padding-left: 10px;
  padding-right: 10px;
}

.calendar-section-caption {
  text-align: center;
  font-size: 1.2em;
}

.setting-general-2nd-column {
  padding-left: 30px;
}

/* Mobile fix for modal scrolling */
@media (max-width: 768px) {
  body.modal-open {
    position: fixed;
  }
}
/* Selected items in lists */
.selected-item {
  background: #f5f7f8;
  font-weight: bolder;
}

/* Holiday Type Colour Picker */
.input-group-addon.color-picker {
  padding: 0;
}
.input-group-addon.color-picker .picker {
  border: 0;
  padding: 0;
}

/* Navbar styles */
.navbar-collapse .navbar-nav > li > a {
  transition: background-color 0.3s ease, color 0.3s ease;
  padding: 10px 15px;
  border-radius: 4px;
  margin: 5px 2px;
}
.navbar-collapse .navbar-nav > li > a:hover, .navbar-collapse .navbar-nav > li > a:focus {
  background-color: var(--hover-bg-color);
  color: var(--hover-text-color);
}
.navbar-collapse .navbar-nav .navbar-form .btn-info {
  transition: background-color 0.3s ease, color 0.3s ease;
}
.navbar-collapse .navbar-nav .navbar-form .btn-info:hover, .navbar-collapse .navbar-nav .navbar-form .btn-info:focus {
  background-color: var(--hover-bg-color);
  color: var(--hover-text-color);
}

@media (max-width: 767px) {
  /* One row: brand | CTA | menu. Disable Bootstrap clearfix pseudo-elements (they break grid/flex). */
  .navbar-header {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .navbar-header::before, .navbar-header::after {
    content: none !important;
    display: none !important;
  }
  .navbar-header .navbar-brand {
    float: none !important;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 34%;
    margin: 0;
    padding-top: 15px;
    padding-bottom: 15px;
    height: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .navbar-header .mobile-header-cta {
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 6px 10px;
    line-height: 1.2;
    max-width: 46%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .navbar-header .navbar-toggle {
    float: none !important;
    flex: 0 0 auto;
    margin: 0 !important;
  }
}
/* Buttons - Theme-aware styling */
.btn {
  background-color: var(--button-bg);
  color: var(--button-text);
  border-color: var(--button-bg);
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.btn:hover, .btn:focus, .btn:active {
  background-color: var(--button-hover-bg);
  border-color: var(--button-hover-bg);
  color: var(--button-text);
}
.btn.btn-primary {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: var(--button-text);
}
.btn.btn-primary:hover, .btn.btn-primary:focus {
  background-color: var(--button-hover-bg);
  border-color: var(--button-hover-bg);
}
.btn.btn-success {
  background-color: var(--leave-cell-bg);
  border-color: var(--leave-cell-bg);
  color: var(--leave-cell-color);
}
.btn.btn-success:hover, .btn.btn-success:focus {
  opacity: 0.9;
  filter: brightness(0.9);
}
.btn.btn-info {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: var(--button-text);
}
.btn.btn-info:hover, .btn.btn-info:focus {
  background-color: var(--button-hover-bg);
  border-color: var(--button-hover-bg);
}
.btn.btn-default {
  background-color: var(--secondary-background-color);
  border-color: var(--divider-color);
  color: var(--text-color);
}
.btn.btn-default:hover, .btn.btn-default:focus {
  background-color: var(--hover-bg-color);
  border-color: var(--divider-color);
  color: var(--hover-text-color);
}
.btn.btn-link {
  background-color: transparent;
  border-color: transparent;
  color: var(--accent-color);
}
.btn.btn-link:hover, .btn.btn-link:focus {
  color: var(--link-hover-color);
  text-decoration: underline;
}

/* Form controls */
.form-control,
.list-group,
.datepicker-days,
.container-fluid:hover {
  color: var(--text-color);
  background-color: var(--background-color);
  border-color: var(--divider-color);
}
.form-control:hover, .form-control:focus,
.list-group:hover,
.list-group:focus,
.datepicker-days:hover,
.datepicker-days:focus,
.container-fluid:hover:hover,
.container-fluid:hover:focus {
  color: var(--hover-text-color);
  background-color: var(--hover-bg-color);
  border-color: var(--accent-color);
}

/* Panels and cards */
.panel {
  background-color: var(--background-color);
  border-color: var(--divider-color);
}
.panel .panel-heading {
  background-color: var(--secondary-background-color);
  border-color: var(--divider-color);
  color: var(--text-color);
}
.panel .panel-body {
  background-color: var(--background-color);
  color: var(--text-color);
}

/* Tables */
.table {
  color: var(--text-color);
}
.table > thead > tr > th {
  border-color: var(--divider-color);
  background-color: var(--secondary-background-color);
}
.table > tbody > tr > td {
  border-color: var(--divider-color);
}
.table > tbody > tr:hover {
  background-color: var(--hover-bg-color);
}

/* Modals */
.modal-content {
  background-color: var(--background-color);
  color: var(--text-color);
  border-color: var(--divider-color);
}

.modal-header {
  background-color: var(--secondary-background-color);
  border-bottom-color: var(--divider-color);
  color: var(--text-color);
}

.modal-body {
  background-color: var(--background-color);
  color: var(--text-color);
}

.modal-footer {
  background-color: var(--secondary-background-color);
  border-top-color: var(--divider-color);
}

/* Dropdowns */
.dropdown-menu {
  background-color: var(--background-color);
  border-color: var(--divider-color);
}
.dropdown-menu > li > a {
  color: var(--text-color);
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
  background-color: var(--hover-bg-color);
  color: var(--hover-text-color);
}

.leave-request-actions-cell {
  white-space: nowrap;
}

.leave-request-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.leave-request-actions form {
  margin: 0;
}

.leave-request-actions .btn {
  margin: 0;
}

.alert {
  background-color: var(--secondary-background-color);
  border-color: var(--divider-color);
  color: var(--text-color);
}

.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}

.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}

/* Cookie consent banner */
.cookie-consent-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1100;
  padding: 1rem 0;
  background-color: var(--secondary-background-color);
  border-top: 1px solid var(--divider-color);
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12);
  color: var(--text-color);
}

.cookie-consent-banner--hidden {
  display: none;
}

body.cookie-consent-banner-visible:not(:has(.custom-footer)) {
  padding-bottom: var(--app-cookie-banner-height);
}

body.cookie-consent-banner-visible:has(.custom-footer) {
  padding-bottom: calc(var(--app-fixed-footer-height) + var(--app-cookie-banner-height));
}

.cookie-consent-banner__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}

.cookie-consent-banner__text {
  flex: 1 1 16rem;
  margin: 0;
  font-size: 0.95rem;
}

.cookie-consent-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  flex-shrink: 0;
}

/*# sourceMappingURL=style.css.map */