@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/InterDisplay-Regular.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/InterDisplay-Medium.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/InterDisplay-Bold.woff2") format("woff2"); }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400; font-display:swap; src: url("../fonts/manrope-v15-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2") format('woff2')}
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 500; font-display:swap; src: url("../fonts/manrope-v15-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2") format('woff2')}
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 700; font-display:swap; src: url("../fonts/manrope-v15-cyrillic_cyrillic-ext_latin_latin-ext-700.woff2") format('woff2')}
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 400; font-display:swap; src: url("../fonts/oswald-v57-cyrillic_latin-regular.woff2") format('woff2')}
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 500; font-display:swap; src: url("../fonts/oswald-v57-cyrillic_latin-500.woff2") format('woff2')}
:root {
  --font1: 'Manrope', sans-serif;
  --font2: 'InterDisplay', sans-serif;
  --font3: 'Oswald', sans-serif;
  --color-sky: #6ECFF6;
  --color-beige: #C49A6C;
  --color-black: #231F20;
  --color-white: #FFFFFF;
  --color-soft-beige: #fbf4ed;
  --color-soft-sky: #D6F0FA;
  --color-softest-sky: #E6F0FA;
  --color-dark-sky: #0b8ed1;
  --color-dark-beige: #967554;
  --color-black-sky: #003366;
  --color-soft-gray: #acacac;
  --color-stats-primary: #0b8ed1;
  --color-stats-amber: #ff9b32;
  --color-stats-emerald: #22b36a;
  --color-stats-coral: #ff7058;
  --color-warning-bg: #df7800;
  --color-warning-text: #fffcec;
  --color-warning-border: #b75b00;
  --radius-sm: 0.55rem;
  --radius-md: 0.8rem;
  --radius-lg: 1.25rem;
}

body{
  font-family: var(--font1);
  min-height: 100vh;
  background: linear-gradient(180deg, rgba(214, 240, 250, 0.4) 0%, rgba(255, 255, 255, 0.9) 100%);
  background-attachment: fixed;
}

@media (max-width: 767.98px) {
  body {
    background-attachment: scroll;
    background-size: 100% 100%;
    background-color: #ffffff;
  }
}

/* Dashboard stats cards */
.card-stats {
  border: 0;
  border-radius: 1.5rem;
  color: #ffffff;
  box-shadow: 0 18px 45px rgba(26, 31, 54, 0.18);
  overflow: hidden;
}

.card-stats .card-body {
  padding: 1.5rem;
}

.card-stats .card-title {
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.9rem;
}

.card-stats .small {
  color: rgba(255, 255, 255, 0.8) !important;
}

.card-stats .fs-3 {
  line-height: 1;
}

.card-stats-primary {
  background: linear-gradient(135deg, #0b8ed1, #063d63);
}

.card-stats-amber {
  background: linear-gradient(135deg, #ffb347, #e97100);
}

.card-stats-emerald {
  background: linear-gradient(135deg, #28c76f, #139a5b);
}

.card-stats-coral {
  background: linear-gradient(135deg, #ff8666, #d94b3d);
}

.text-primary-sky {
  color: var(--color-stats-primary) !important;
}

.text-amber {
  color: var(--color-stats-amber) !important;
}

.text-emerald {
  color: var(--color-stats-emerald) !important;
}

.text-coral {
  color: var(--color-stats-coral) !important;
}

.badge-status-paid {
  background: var(--color-stats-emerald);
  color: #fff;
}

.badge-status-pending {
  background: var(--color-stats-coral);
  color: #fff;
}

.badge-status-info {
  background: var(--color-stats-primary);
  color: #fff;
}

.badge-status-warning {
  background: var(--color-stats-amber);
  color: #fff;
}


.bg-success {
  background-color: var(--color-stats-emerald) !important;
  border-color: var(--color-stats-emerald) !important;
  color: #fff !important;
}

.text-success {
  color: var(--color-stats-emerald) !important;
}

.bg-warning {
  background-color: var(--color-stats-coral) !important;
  border-color: var(--color-stats-coral) !important;
  color: #fff !important;
}

.text-warning {
  color: var(--color-stats-coral) !important;
}

.badge.bg-warning {
  background-color: var(--color-stats-coral) !important;
  color: var(--color-white) !important;
}

.border-warning {
  border-color: var(--color-warning-border) !important;
}

.alert-warning,
.bg-warning-subtle {
  background-color: rgba(248, 181, 71, 0.2) !important;
  color: var(--color-warning-text) !important;
  border-color: var(--color-warning-border) !important;
}

.btn-warning {
  background-color: var(--color-warning-bg);
  border-color: var(--color-warning-border);
  color: var(--color-white);
}

.btn-warning:hover,
.btn-warning:focus {
  background-color: #e09112;
  border-color: #cf810f;
  color: var(--color-white);
}

.btn-success {
  background-color: var(--color-stats-emerald);
  border-color: var(--color-stats-emerald);
}

.btn-success:hover,
.btn-success:focus {
  background-color: #1a8a52;
  border-color: #187b49;
  color: #fff;
}

.btn-outline-warning {
  color: var(--color-stats-coral);
  border-color: var(--color-stats-coral);
}

.btn-outline-warning:hover,
.btn-outline-warning:focus {
  background-color: rgba(255, 112, 88, 0.1);
  border-color: var(--color-stats-coral);
  color: var(--color-stats-coral);
  box-shadow: none;
}

.status-icon-positive {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  font-size: 0.75rem;
  border-radius: 50%;
  background-color: var(--color-stats-emerald);
  color: #fff;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font1);
  font-weight: 700;
}

form .card {
  border: 1px solid rgba(0, 119, 168, 0.08);
  border-radius: var(--radius-md);
  box-shadow: 0 22px 55px rgba(15, 91, 134, 0.12);
}

form .card-header {
  background-color: var(--color-soft-sky);
  border-top-left-radius: calc(var(--radius-md) - 0.3rem) !important;
  border-top-right-radius: calc(var(--radius-md) - 0.3rem) !important;
  color: #003366;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.card .card-header {
  background-color: var(--color-soft-sky);
  border-top-left-radius: calc(var(--radius-md) - 0.3rem);
  border-top-right-radius: calc(var(--radius-md) - 0.3rem);
  color: #003366;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.card {
  border-radius: var(--radius-md);
}

.card > .card-body:first-child {
  border-top-left-radius: calc(var(--radius-md) - 0.3rem);
  border-top-right-radius: calc(var(--radius-md) - 0.3rem);
}

.card > .card-body:last-child {
  border-bottom-left-radius: calc(var(--radius-md) - 0.3rem);
  border-bottom-right-radius: calc(var(--radius-md) - 0.3rem);
}

.card > .card-footer:last-child {
  border-bottom-left-radius: calc(var(--radius-md) - 0.3rem);
  border-bottom-right-radius: calc(var(--radius-md) - 0.3rem);
}

.btn {
  border-radius: var(--radius-md);
}

.alert {
  border-radius: var(--radius-md);
}

.form-control,
input:not([type="radio"]):not([type="checkbox"]),
select,
textarea {
  border-radius: var(--radius-sm);
}

/* Workshops overrides: consistent widths */
.overrides-line .override-ig {
  min-width: 200px;
  max-width: 200px;
}
.overrides-line .override-ig .input-group-text {
  min-width: 100px;
  justify-content: center;
}

/* Absolute badges over workshop title input */
.override-badges {
  position: absolute;
  top: -5px;
  right: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  z-index: 2;
}
/* Keep badges readable over input backgrounds */
.override-badges .badge {
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

@media (max-width: 576px) {
  .overrides-line .override-ig {
    min-width: 100%;
    max-width: 100%;
  }
  .overrides-line .override-ig .input-group-text {
    min-width: 110px; /* slightly wider labels on small screens */
  }
  .override-badges {
    position: absolute;
    top: 6px;
    right: 8px;
    max-width: 65%;
  }
}

.card-body h2, .card-body h4{
  font-family: var(--font1);
}

.card-body {
  font-family: var(--font2);
}

.card-title {
  font-weight: 400;
}

.stats-card-title {
  font-family: var(--font3);
  text-transform: uppercase;
  font-weight: 500;
}

.denied-img {
  width: 300px;
  height: auto;
}

.hidden {
  display: none;
}

.admin-nav {
  text-decoration: none;
  color: inherit;
}

/* New workshop row differentiation */
#new-workshop-row.table-new {
  background: var(--color-soft-sky); /* soft sky tint */
}
#new-workshop-row.table-new td {
  border-top: 2px dashed rgba(0,0,0,0.06);
  background: var(--color-soft-sky); /* soft sky tint */
}
#new-workshop-row.table-new .new-ws-title .input-group-text {
  background: var(--color-soft-sky);
  color: var(--color-dark-sky);
  border-color: var(--color-soft-sky);
}
#new-workshop-row.table-new .form-text {
  color: #6c757d; /* bootstrap secondary */
}

.logo-closed {
  width: 300px;
}

.shadow-page {
  box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}

.verification-link {
  text-decoration: none;
}

.verification-link:hover .badge {
  background-color: var(--color-beige) !important;
}

#verificationModal .modal-body {
  padding: 0;
}

#verificationImage {
  max-height: 80vh;
  object-fit: contain;
}

.note-toolbar {
  background: rgba(3,37,41,0.03);
}

.title-link {
  text-decoration: none;
  color: var(--color-black);
  gap: 0.75rem;
}

.title-text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.nav-switch-link {
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  padding: 0.35rem 0.35rem;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.nav-switch-link:active {
  background-color: rgba(110, 207, 246, 0.15);
}

.nav-switch-link::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  background: rgba(110, 207, 246, 0.6);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.4s ease, opacity 0.4s ease;
  pointer-events: none;
}

.nav-switch-link:active::after {
  transform: translate(-50%, -50%) scale(12);
  opacity: 1;
}

.nav-switch-icon {
  display: inline-flex;
  align-items: center;
}

.nav-mobile-conference {
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  margin-left: 0;
  margin-top: 0.25rem;
  line-height: 1;
  color: rgba(35, 31, 32, 0.65);
}

.nav-switch-icon i,
.logout-icon {
  font-size: 1.35rem;
  line-height: 1;
}

.nav-switch-spinner {
  display: none;
  align-items: center;
}

.nav-switch-spinner .spinner-border {
  width: 1.25rem;
  height: 1.25rem;
  border-width: 0.15em;
}

.nav-switch-loading .nav-switch-icon {
  display: none !important;
}

.nav-switch-loading .nav-switch-spinner {
  display: inline-flex !important;
}

.nav-link {
  font-weight: 700;
  color: #6c757d;
}

.navbar-toggler:focus, 
.navbar-toggler:active {
  box-shadow: none;
  outline: none;
}

.nav-link:hover {
  color: var(--color-black);
}

/* Default small size for mobile */
.dashboard-title {
  font-size: 1.25rem; 
}

/* Tablets and up */
@media (min-width: 768px) { 
  .dashboard-title {
    font-size: 1.75rem;
  }
}

/* Desktops and up */
@media (min-width: 992px) { 
  .dashboard-title {
    font-size: 2.5rem;
  }
}

.bigger {
  font-size: 1.1rem;
}

.smaller {
  font-size: 0.75rem;
}

.registration-type {
  /* font-size: 0.75rem; */
  /* padding: 0.12rem 0.35rem; */
  color: var(--color-white);
  font-weight: bold;
  font-family: var(--font1);
}

.font-manrope {
  font-family: var(--font1);
}

.font-inter {
  font-family: var(--font2);
}

.font-oswald {
  font-family: var(--font3);
}

/* DataTables Custom Styling */
.dataTables_wrapper .dataTables_length select {
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
}

.dataTables_wrapper .dataTables_filter input {
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  margin-left: 0.5rem;
}

.datatable-toolbar {
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 999px;
  padding: 0.25rem 0.5rem;
  background: #fff;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.datatable-toolbar label {
  margin-bottom: 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 600;
  color: #4a5568;
}

.datatable-toolbar input[type="search"] {
  border: none;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.04);
  padding: 0.35rem 0.9rem;
  font-size: 0.95rem;
}

.datatable-toolbar input[type="search"]:focus {
  background: rgba(0, 0, 0, 0.07);
  outline: none;
  box-shadow: none;
}

.datatable-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.toolbar-pill {
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.05);
  color: #1f2933;
  border: 1px solid transparent;
  padding: 0.35rem 0.85rem;
  font-weight: 600;
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  font-size: 0.9rem;
}

.toolbar-pill i {
  margin-right: 0.35rem;
}

.toolbar-pill:hover,
.toolbar-pill:focus {
  background: rgba(0, 0, 0, 0.08);
  color: #0b8ed1;
  border-color: rgba(11, 142, 209, 0.3);
}

.dataTables_wrapper .dataTables_info {
  padding-top: 1rem;
}

.dataTables_wrapper .dataTables_paginate {
  padding-top: 1rem;
}

.dataTables_filter input:focus,
.dataTables_length select:focus {
outline: none;
box-shadow: none;
border-color: #aaa;
}

table.dataTable thead>tr>th.dt-orderable-asc:hover,
table.dataTable thead>tr>th.dt-orderable-desc:hover,
table.dataTable thead>tr>td.dt-orderable-asc:hover,
table.dataTable thead>tr>td.dt-orderable-desc:hover {
  outline: 0px solid rgba(0, 0, 0, 0.05);
  outline-offset: 0px;
}

table.dataTable td.dt-type-numeric,
table.dataTable th.dt-type-numeric {
  text-align: left;
}

#registrations-table_wrapper {
  min-height: 300px;
}

.empty-table-container {
  text-align: center;
  padding: 24px;
  color: #6c6c6c;
}

.empty-table-container img {
  max-width: 200px;
  display: block;
  margin: 0 auto 20px;
}

/* Additional stats horizontal scroll */
.additional-stats-scroll {
  position: relative;
  overflow-x: hidden;
}

.additional-stats-row {
  margin-left: 0;
  margin-right: 0;
  transition: scroll-behavior 0.2s ease;
}

.additional-stats-row-dragging {
  cursor: grabbing;
}

@media (max-width: 767.98px) {
  .additional-stats-scroll {
    margin-left: 0;
    margin-right: 0;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .additional-stats-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    gap: 1rem;
  }

  .additional-stats-row::-webkit-scrollbar {
    display: none;
  }

  .additional-stats-card {
    padding-left: 0;
    padding-right: 0;
    flex: 0 0 auto;
    min-width: 240px;
    scroll-snap-align: start;
  }
}

/* Custom button - Sky Blue */
.btn-sky {
  background-color: var(--color-sky);
  border-color: var(--color-sky);
  color: #fff;
}

.btn-sky:hover {
  background-color: #5ABDD9;
  border-color: #5ABDD9;
  color: #fff;
}

.btn-sky:focus, .btn-sky.focus {
  box-shadow: 0 0 0 0.25rem rgba(110, 207, 246, 0.5);
}

.btn-sky:active {
  background-color: #4FA8C1;
  border-color: #4FA8C1;
}

/* Custom button - Dark Sky */
.btn-dark-sky {
  background-color: var(--color-dark-sky);
  border-color: var(--color-dark-sky);
  color: #fff;
}

.btn-dark-sky:hover {
  background-color: #00628c;
  border-color: #00628c;
  color: #fff;
}

.btn-dark-sky:focus, .btn-dark-sky.focus {
  box-shadow: 0 0 0 0.25rem rgba(110, 207, 246, 0.5);
}

.btn-dark-sky:active {
  background-color: #02567a;
  border-color: #02567a;
}

.btn-dark-sky:disabled,
.btn-dark-sky.disabled {
  background-color: #9ca3af;
  border-color: #9ca3af;
  color: #e5e7eb;
  cursor: not-allowed;
  opacity: 0.7;
}

.btn-outline-dark-sky {
  background-color: transparent;
  border-color: var(--color-dark-sky);
  color: var(--color-dark-sky);
}

.btn-outline-dark-sky:hover {
  background-color: var(--color-dark-sky);
  color: #fff;
}

.btn-outline-dark-sky:focus, 
.btn-outline-dark-sky.focus {
  box-shadow: 0 0 0 0.25rem rgba(2, 86, 122, 0.5);
}

.btn-outline-dark-sky:active {
  background-color: #02567a;
  border-color: #02567a;
  color: #fff;
}

/* Custom button - Warm Beige */
.btn-beige {
  background-color: var(--color-beige);
  border-color: var(--color-beige);
  color: #fff;
}

.btn-beige:hover {
  background-color: #B0895E;
  border-color: #B0895E;
  color: #fff;
}

.btn-beige:focus, .btn-beige.focus {
  box-shadow: 0 0 0 0.25rem rgba(196, 154, 108, 0.5);
}

.btn-beige:active {
  background-color: #9F7850;
  border-color: #9F7850;
}

/* Dashboard layout */
.dashboard-shell {
  min-height: 100vh;
  background: transparent;
}

.dashboard-shell .container-fluid {
  max-width: 1300px;
}

.dashboard-nav {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 1rem;
  padding: 1rem 1.5rem;
  border: 1px solid rgba(0, 119, 168, 0.08);
  box-shadow: 0 16px 35px rgba(2, 86, 122, 0.08);
  backdrop-filter: blur(8px);
}

.dashboard-nav .dashboard-title {
  margin-bottom: 0;
}

.dashboard-nav .nav-link {
  font-weight: 400;
  color: #4b5563;
  padding: 0.5rem 0.25rem !important;
  margin: 0 0.65rem;
  transition: color 0.2s ease, border-bottom 0.2s ease;
}

.dashboard-nav .nav-link.active {
  color: var(--color-dark-sky);
  background-color: transparent;
  border-bottom: 2px solid var(--color-dark-sky);
  transition: color 0.2s ease, border-bottom 0.2s ease;
}

.dashboard-nav .nav-link.active:hover,
.dashboard-nav .nav-link.active:focus {
  color: var(--color-dark-sky);
  background-color: transparent;
  border-bottom: 2px solid var(--color-dark-sky);
  transition: color 0.2s ease, border-bottom 0.2s ease;
}

.dashboard-nav .nav-link:hover,
.dashboard-nav .nav-link:focus {
  color: #4b5563;
  background-color: transparent;
  border-bottom: 2px solid #4b5563;
  transition: color 0.2s ease, border-bottom 0.2s ease;
}

.dashboard-nav .nav-link.text-danger:hover,
.dashboard-nav .nav-link.text-danger:focus {
  color: #dc3545;
  background-color: transparent;
  border-bottom: 2px solid #dc3545;
  transition: color 0.2s ease, border-bottom 0.2s ease;
}

.dashboard-page-header {
  background: #ffffff;
  border-radius: 1rem;
  padding: 1.5rem 2rem;
  border: 1px solid rgba(0, 119, 168, 0.08);
  box-shadow: 0 22px 45px rgba(2, 86, 122, 0.08);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.dashboard-page-eyebrow {
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--color-dark-sky);
  display: inline-block;
  margin-bottom: 0.35rem;
}

.dashboard-page-title {
  margin: 0;
  font-size: 2.35rem;
  font-weight: 700;
  color: var(--color-black);
}

.dashboard-page-subtitle {
  margin: 0;
  color: #4b5563;
  font-size: 1rem;
  font-weight: 500;
}

.dashboard-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.dashboard-page-actions .btn {
  font-weight: 600;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.dashboard-shell form .card,
.dashboard-shell .card {
  border-radius: var(--radius-lg);
  border: 1px solid rgba(0, 119, 168, 0.08);
  box-shadow: 0 22px 55px rgba(15, 91, 134, 0.12);
}

.dashboard-shell .card > .card-body:first-child {
  border-top-left-radius: calc(var(--radius-lg) - 0.3rem);
  border-top-right-radius: calc(var(--radius-lg) - 0.3rem);
}

.dashboard-shell .card > .card-body:last-child {
  border-bottom-left-radius: calc(var(--radius-lg) - 0.3rem);
  border-bottom-right-radius: calc(var(--radius-lg) - 0.3rem);
}

.dashboard-shell .card > .card-footer:last-child {
  border-bottom-left-radius: calc(var(--radius-lg) - 0.3rem);
  border-bottom-right-radius: calc(var(--radius-lg) - 0.3rem);
}

.dashboard-shell .card-body {
  background: #ffffff;
  padding: 1.75rem;
}

.dashboard-shell .card-header {
  /* background: rgba(214, 240, 250, 0.45); */
  border-bottom: 1px solid rgba(110, 207, 246, 0.3);
  border-top-left-radius: calc(var(--radius-lg) - 0.3rem);
  border-top-right-radius: calc(var(--radius-lg) - 0.3rem);
}

.rounded-flag {
  border-radius: 3px;
}

.templates-card {
  overflow: hidden;
}

.templates-card .card-body {
  padding-bottom: 2rem;
}

.dashboard-shell .card-body .card {
  box-shadow: none;
  border-radius: var(--radius-md);
  border: 1px solid rgba(0, 119, 168, 0.1);
}

.dashboard-shell .card-body .card-body {
  padding: 1.5rem;
}

@media (max-width: 991.98px) {
  .dashboard-page-header {
    padding: 1.25rem 1.5rem;
  }

  .dashboard-page-title {
    font-size: 1.85rem;
  }

  .dashboard-shell .card-body {
    padding: 1.5rem;
  }

  .dashboard-nav .navbar-collapse {
    padding-top: 1.5rem;
  }

  .dashboard-nav .navbar-nav {
    gap: 0.35rem;
  }
}

@media (max-width: 575.98px) {
  .dashboard-nav {
    padding: 0.75rem 1rem;
  }

  .dashboard-nav .nav-link {
    margin: 0.15rem 0;
  }

  .dashboard-page-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Background Utilities */
.bg-sky {
  background-color: var(--color-sky) !important;
}

.bg-soft-sky {
  background-color: var(--color-soft-sky) !important;
}

.bg-softest-sky {
  background-color: var(--color-softest-sky) !important;
}

.bg-dark-sky {
  background-color: var(--color-dark-sky) !important;
}

.bg-beige {
  background-color: var(--color-beige) !important;
}

.bg-soft-beige {
  background-color: var(--color-soft-beige) !important;
}

.bg-soft-gray {
  background-color: var(--color-soft-gray) !important;
}

.bg-dark-beige {
  background-color: var(--color-dark-beige) !important;
}

.bg-dark-sky {
  background-color: var(--color-dark-sky) !important;
}

.border-soft-gray {
  border-color: var(--color-soft-gray) !important;
}

/* Primary Color Overrides */
.text-primary {
  color: var(--color-dark-sky) !important;
}

.bg-primary {
  background-color: var(--color-dark-sky) !important;
}

.border-primary {
  border-color: var(--color-dark-sky) !important;
}

.btn-primary {
  background-color: var(--color-dark-sky);
  border-color: var(--color-dark-sky);
  color: var(--color-white);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #005d87;
  border-color: #005d87;
  color: var(--color-white);
}

.alert-primary {
  background-color: rgba(0, 119, 168, 0.1) !important;
  color: var(--color-dark-sky) !important;
  border-color: var(--color-dark-sky) !important;
}

/* Pagination Overrides */
.page-link {
  color: var(--color-dark-sky);
  border-color: var(--color-dark-sky);
}

.page-link:hover {
  color: #005d87;
  background-color: rgba(0, 119, 168, 0.1);
  border-color: #005d87;
}

.page-item.active .page-link {
  background-color: var(--color-dark-sky);
  border-color: var(--color-dark-sky);
}

.page-item.active .page-link:hover {
  background-color: #005d87;
  border-color: #005d87;
  color: var(--color-white);
}

/* Text Color Utilities */
.text-sky {
  color: var(--color-sky) !important;
}

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

.text-soft-gray {
  color: var(--color-soft-gray) !important;
}

.alert-soft-sky {
  background-color: var(--color-soft-sky);
  color: #004B6B;
  border-color: #c6dee7;
}

.alert-mag-sky {
  background-color: var(--color-soft-sky);
  color: #003366;
  border-left: 5px solid #0077A8;
  padding: 1rem;
}

@media (min-width: 768px) {
  .alert-mag-sky {
    padding: 2rem;
  }
}

.alert-mag-beige {
  background-color: var(--color-soft-beige);
  color: #6D4C3D;
  border-left: 5px solid #C49A6C;
  padding: 15px;
}

.form-check-input {
  border: 1px solid var(--color-black-sky) !important;
}

.form-check-input:checked {
  background-color: var(--color-dark-sky) !important;
  border-color: var(--color-black) !important;
}

.modal-content {
  border-radius: var(--radius-lg);
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-copy {
  cursor: copy;
}

.cursor-default {
  cursor: default;
}

#inv_dob::placeholder {
  color: #869098; /* Bootstrap default gray */
}

#imageAnalysis {
  max-width: 100%;
  margin: 0 auto 1rem;
}

#imageAnalysis .row {
  margin-left: 0;
  margin-right: 0;
}

#imageAnalysis .col-md-6 {
  padding: 0.5rem;
}

.dropdown-item:focus, .dropdown-item:hover {
  background-color: var(--color-soft-sky);
}

/* Validation for the form */
#validation-messages {
  margin-bottom: 1.5rem;
  border-left: 5px solid #dc3545;
}

#validation-messages:not(.d-none) {
  display: block !important;
}

#validation-errors-list {
  margin-bottom: 0;
  padding-left: 1.25rem;
}

#validation-errors-list li {
  color: #dc3545;
}

.invalid-feedback {
  display: block !important;
  color: #dc3545;
  margin-top: 0.25rem;
  font-size: 0.875em;
}

.is-invalid {
  border-color: #dc3545 !important;
  padding-right: calc(1.5em + 0.75rem);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.verification-upload.d-none input[required] {
  display: none !important;
}

.verification-upload.d-none input {
  display: none !important;
}

.verification-upload:not(.d-none) input {
  display: block !important;
}

.workshop-count {
  cursor: pointer;
  width: 26px;
  height: 26px;
  font-size: 0.75rem;
  font-family: var(--font1);
  color: var(--color-white);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  text-align: center;
  transition: 0.2s;
  position: relative;
  overflow: visible;
}

.workshop-count:hover {
  transform: scale(1.05);
}

.workshop-count::before,
.workshop-count::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  background-color: rgba(25, 135, 84, 0.35);
  transform: scale(1);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.workshop-count:hover::after {
  animation: workshop-pulse 1.25s ease-out infinite;
}

.workshop-count:hover::before {
  animation: workshop-pulse 1.25s ease-out infinite;
  animation-delay: 0.35s;
}

@keyframes workshop-pulse {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  60% {
    transform: scale(1.75);
    opacity: 0;
  }
  100% {
    transform: scale(1.75);
    opacity: 0;
  }
}

.popover {
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  --bs-popover-max-width: 100%;
}

.popover-body {
  font-size: 0.8rem;
  line-height: 1.4;
}

.workshop-title-item {
  padding: 6px 0;
  border-bottom: 1px solid #eee;
}

.workshop-title-item:last-child {
  border-bottom: none;
}

/* Total breakdown styles */
#total-breakdown {
  background: #ffffff;
  border: 1px solid #c6dee7;
  padding: 0.75rem;
  margin-top: 0.5rem;
}

.breakdown-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px dashed #e3eef3;
}

.breakdown-item:last-child {
  border-bottom: none;
}

.breakdown-label {
  color: #003d59;
}

.breakdown-amount {
  font-weight: 700;
  color: #003366;
}

/* Payment method card styles */
.payment-method-card {
  border: 2px solid rgba(0, 119, 168, 0.25);
  padding: 0.875rem;
  cursor: pointer;
  transition: all 0.2s ease;
  height: 100%;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 51, 102, 0.08);
}

.payment-method-card:hover {
  border-color: rgba(0, 119, 168, 0.5);
  background-color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 119, 168, 0.25);
}

.payment-method-card.selected,
.payment-method-card.active {
  border-color: var(--color-dark-sky);
  background-color: #ffffff;
  box-shadow: 0 4px 16px rgba(0, 119, 168, 0.35);
  transform: translateY(-1px);
}

.payment-method-label {
  cursor: pointer;
  margin-bottom: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  width: 100%;
  position: relative;
}

.payment-icon {
  font-size: 1.5rem;
  color: #6c757d;
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.payment-method-card.selected .payment-icon,
.payment-method-card.active .payment-icon {
  color: var(--color-dark-sky);
}

/* Checkmark styling - positioned on the right */
.payment-checkmark {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.75rem;
  color: var(--color-dark-sky);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

/* Show checkmark when payment method is selected/active */
.payment-method-card.selected .payment-checkmark,
.payment-method-card.active .payment-checkmark {
  opacity: 1;
}

.payment-text {
  flex: 1;
}

.payment-title {
  font-size: 1rem;
  font-weight: 600;
  color: #6c757d;
  margin-bottom: 0.25rem;
  transition: color 0.2s ease;
}

.payment-description {
  font-size: 0.8125rem;
  color: #6c757d;
  line-height: 1.4;
  transition: color 0.2s ease;
}

.payment-method-card.selected .payment-title,
.payment-method-card.active .payment-title {
  color: var(--color-black);
}

.payment-method-card.selected .payment-description,
.payment-method-card.active .payment-description {
  color: #6c757d;
}

/* Payment notes styling */
.payment-note {
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 8px !important;
  padding: 0.875rem 1rem;
  border: 1px solid rgba(0, 119, 168, 0.15);
}

.payment-section h6 {
  font-weight: 600;
  letter-spacing: 0.3px;
}

/* Info box styling for section descriptions */
.info-box {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.5rem;
  background-color: rgba(248, 249, 250, 0.8);
  border-left: 3px solid #adb5bd;
  border-radius: 4px;
}

.info-box-icon {
  color: #6c757d;
  font-size: 0.9rem;
  margin-top: 2px;
  flex-shrink: 0;
}

.info-box-text {
  margin-bottom: 0;
  color: #495057;
  line-height: 1.5;
}

/* Submit button enhancement */
.submit-button {
  /* font-weight: 600; */
  letter-spacing: 0.5px;
  padding: 0.875rem 1.5rem !important;
  box-shadow: 0 4px 14px rgba(0, 51, 102, 0.25);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  border-radius: 8px !important;
}

.submit-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 51, 102, 0.35);
}

.submit-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0, 51, 102, 0.2);
}

.submit-button i.bi-arrow-right-circle-fill {
  transition: transform 0.3s ease;
}

.submit-button:hover i.bi-arrow-right-circle-fill {
  transform: translateX(4px);
}

/* Responsive submit button width */
.submit-button-responsive {
  width: 100%;
}

@media (min-width: 1100px) {
  .submit-button-responsive {
    width: 45%;
  }
}