@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');
/*---------------------------------------
  VARIABLES
-----------------------------------------*/
:root {
  --body-bg-color:                #ffffff;
  --white-color:                  #ffffff;
  --primary-color:                #E07A5F;     /* Ζεστό κόκκινο-κεραμιδί */
  --secondary-color:              #F2CC8F;     /* Χρυσόπανο-μπεζ */
  --section-bg-color:             #f9f9f9;
  --custom-btn-bg-color:          #A8DADC;     /* Δροσερό γαλάζιο */
  --custom-btn-bg-hover-color:    #1D3557;     /* Σκούρο μπλε */
  --heading-color:                #1D3557;
  --dark-color:                   #000000;
  --p-color:                      #4a4a4a;
  --border-color:                 #e0e0e5;
  --link-hover-color:             #F2CC8F;
  --navbar-bg-color:              #ffffff;
  --navbar-text-color:            #000000;

  /* Phase 11 - Surface and text variables for dark mode */
  --rv-surface:                   #ffffff;
  --rv-surface-alt:               #f7f7f9;
  --rv-text:                      #222222;
  --rv-text-muted:                #777777;
  --rv-border-subtle:             #e0e3ea;

  --body-font-family: 'Roboto', sans-serif;
  --heading-font-family: 'Playfair Display', serif;


  --h1-font-size:                 62px;
  --h2-font-size:                 36px;
  --h3-font-size:                 28px;
  --h4-font-size:                 24px;
  --h5-font-size:                 22px;
  --h6-font-size:                 20px;
  --p-font-size:                  18px;
  --menu-font-size:               16px;
  --btn-font-size:                14px;
  --copyright-font-size:          12px;

  --border-radius-large:          100px;
  --border-radius-medium:         20px;
  --border-radius-small:          10px;

  --font-weight-light:            300;
  --font-weight-normal:           400;
  --font-weight-medium:           500;
  --font-weight-bold:             700;
  --rv-mobile-nav-h:              68px;
}

/* Dark Theme */
body.dark-mode {
  --body-bg-color:                #181818;
  --white-color:                  #101728;
  --section-bg-color:            #242424;
  --heading-color:               #bd9759;
  --dark-color:                  #f5f7ff;
  --p-color:                     #c5c5c5;
  --primary-color:               #f39150;
  --secondary-color:             #E07A5F;
  --custom-btn-bg-color:         #3A506B;
  --custom-btn-bg-hover-color:   #408382;
  --border-color:                #444;
  --link-hover-color:            #E07A5F;
  --navbar-bg-color:             #1e1e1e;
  --navbar-text-color:           #ffffff;

  /* Phase 11 - Surface and text overrides */
  --rv-surface:                   #1f2538;
  --rv-surface-alt:               #151a2b;
  --rv-text:                      #f5f7ff;
  --rv-text-muted:                #9fa7c7;
  --rv-border-subtle:             #272e45;
}

body {
  font-family: var(--body-font-family);
  background-color: var(--body-bg-color);
  color: var(--p-color);
}

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

.navbar .nav-link,
.navbar .navbar-brand,
.navbar .dropdown-toggle,
.navbar .form-control {
  color: var(--navbar-text-color) !important;
}



.calendar-page {
  min-width: 0;
}

.calendar-shell {
  background: var(--rv-surface);
  border: 1px solid var(--rv-border-subtle);
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(11, 64, 156, 0.08);
  padding: 0.95rem;
}

.calendar-shell-head {
  padding: 0.2rem 0.2rem 0.75rem;
  border-bottom: 1px solid var(--rv-border-subtle);
  margin-bottom: 0.8rem;
}

.calendar-new-event-btn {
  border-radius: 999px;
  font-weight: 600;
  white-space: nowrap;
}

.rv-calendar-shell {
  overflow: visible;
}

.rv-cal-toolbar {
  position: sticky;
  top: calc(var(--topbar-h, 0px) + 8px);
  z-index: 4;
  background: var(--rv-surface);
}

.rv-cal-toolbar-top {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.75rem;
}

.rv-cal-actions {
  min-width: 0;
  flex-wrap: nowrap;
}

.rv-cal-title {
  text-align: center;
  font-weight: 700;
  color: var(--heading-color);
}

.rv-cal-nav .btn {
  min-width: 38px;
}

.rv-cal-segmented .btn {
  border-radius: 999px;
  font-weight: 600;
}

.rv-cal-segmented .btn.is-active {
  color: var(--white-color);
  background: var(--primary-color);
  border-color: var(--primary-color);
}

.rv-quick-add {
  margin-top: 0.65rem;
  padding: 0.8rem;
  border-radius: 14px;
  border: 1px solid var(--rv-border-subtle);
  background: var(--rv-surface);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}

.rv-quick-add-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.6rem;
}

.rv-quick-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
}

.rv-cal-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.8rem;
  align-items: start;
}

.rv-cal-main {
  min-width: 0;
  overflow: hidden;
}

.rv-cal-scroll {
  max-width: 100%;
}

.rv-cal-drawer {
  border: 1px solid var(--rv-border-subtle);
  border-radius: 16px;
  background: var(--rv-surface);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.08);
  max-height: calc(100vh - 130px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateX(120%);
  opacity: 0;
  pointer-events: none;
  transition: transform .25s ease, opacity .25s ease;
}

.rv-cal-layout.drawer-open .rv-cal-drawer {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.rv-cal-drawer-head,
.rv-cal-drawer-foot {
  padding: 0.9rem;
  border-bottom: 1px solid var(--rv-border-subtle);
  background: var(--rv-surface-alt);
}

.rv-cal-drawer-foot {
  border-bottom: 0;
  border-top: 1px solid var(--rv-border-subtle);
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}

.rv-cal-drawer-body {
  padding: 0.9rem;
  overflow: auto;
}

.rv-cal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(5, 10, 20, 0.38);
  z-index: 1090;
}

.rv-mobile-agenda {
  display: none;
  margin-top: 0.75rem;
  border: 1px solid var(--rv-border-subtle);
  border-radius: 14px;
  background: var(--rv-surface);
}

.rv-mobile-agenda-head {
  padding: 0.7rem 0.75rem;
  border-bottom: 1px solid var(--rv-border-subtle);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.rv-mobile-agenda-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rv-mobile-agenda-item,
.rv-mobile-agenda-empty {
  display: flex;
  gap: 0.7rem;
  padding: 0.65rem 0.75rem;
  border-bottom: 1px solid var(--rv-border-subtle);
}

.rv-mobile-agenda-list li:last-child {
  border-bottom: 0;
}

.rv-mobile-agenda-item {
  cursor: pointer;
}

.rv-mobile-agenda-time {
  width: 56px;
  font-size: 0.82rem;
  color: var(--p-color);
}

.rv-mobile-agenda-main strong {
  display: block;
  color: var(--heading-color);
}

.rv-mobile-agenda-main small {
  color: var(--p-color);
}

#calendar .fc .rv-day-selected {
  outline: 2px solid color-mix(in srgb, var(--primary-color) 45%, #ffffff);
  outline-offset: -2px;
}

#calendar {
  width: 100%;
  background: transparent;
  padding: 0.25rem;
  border-radius: 14px;
}

#calendar .fc {
  --fc-border-color: #e5ebf5;
  --fc-page-bg-color: transparent;
  --fc-neutral-bg-color: #f5f8ff;
  --fc-list-event-hover-bg-color: #f7faff;
  --fc-today-bg-color: #fff2e8;
  --fc-button-bg-color: #f3f7ff;
  --fc-button-border-color: #d6e0f3;
  --fc-button-text-color: #1d3557;
  --fc-button-hover-bg-color: #e5eefc;
  --fc-button-hover-border-color: #b9c8e9;
  --fc-button-active-bg-color: #163763;
  --fc-button-active-border-color: #163763;
  --fc-button-active-text-color: #ffffff;
  --fc-event-bg-color: #e07a5f;
  --fc-event-border-color: #e07a5f;
}

#calendar .fc .fc-toolbar {
  margin-bottom: 0.7rem !important;
  gap: 0.5rem;
}

#calendar .fc .fc-toolbar-title {
  color: var(--heading-color);
  font-weight: 700;
  font-size: clamp(1.1rem, 2.2vw, 1.55rem);
}

#calendar .fc .fc-button {
  border-radius: 10px;
  text-transform: lowercase;
  font-weight: 600;
  box-shadow: none !important;
}

#calendar .fc .fc-button:focus {
  box-shadow: 0 0 0 0.16rem rgba(29, 53, 87, 0.18) !important;
}

#calendar .fc .fc-daygrid-day {
  transition: background-color .18s ease;
}

#calendar .fc .fc-daygrid-day:hover {
  background: #f8fbff;
}

#calendar .fc .fc-col-header-cell-cushion,
#calendar .fc .fc-daygrid-day-number {
  color: #264a78;
  font-weight: 600;
  text-decoration: none;
}

#calendar .fc .fc-daygrid-day.fc-day-today {
  background: var(--fc-today-bg-color);
}

#calendar .fc .fc-event {
  border: 0 !important;
  border-radius: 8px;
  padding: 2px 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

#calendar .fc .fc-daygrid-event {
  margin-top: 2px;
  margin-bottom: 2px;
}

/* FullCalendar mobile responsiveness */
#calendar .fc,
#calendar .fc-view-harness {
  max-width: 100%;
}

@media (max-width: 991.98px) {
  #calendar {
    padding: 0.2rem;
    overflow: visible;
  }

  .rv-cal-toolbar {
    top: calc(var(--topbar-h, 0px) + 4px);
  }

  .rv-cal-toolbar-top {
    grid-template-columns: 1fr;
  }

  .rv-cal-title {
    text-align: left;
    order: -1;
  }

  .rv-cal-actions {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
    gap: 0.4rem !important;
  }

  .rv-cal-actions::-webkit-scrollbar {
    display: none;
  }

  .rv-cal-segmented {
    display: flex;
    flex-wrap: nowrap;
    flex: 1 1 auto;
    min-width: 0;
  }

  .rv-cal-segmented::-webkit-scrollbar {
    display: none;
  }

  .rv-cal-segmented .btn {
    white-space: nowrap;
    padding: 0.33rem 0.45rem;
    font-size: 0.78rem;
    min-width: 64px;
  }

  .calendar-new-event-btn {
    flex: 0 0 auto;
    padding: 0.35rem 0.5rem;
    font-size: 0.78rem;
    min-width: 40px;
  }

  .rv-qa-label {
    white-space: nowrap;
  }

  .rv-cal-layout.drawer-open .rv-cal-drawer {
    display: flex;
    position: fixed;
    right: 8px;
    left: 8px;
    top: 72px;
    bottom: 8px;
    z-index: 1091;
    max-height: none;
  }

  .calendar-shell {
    border-radius: 14px;
    padding: 0.5rem;
  }

  #calendar .fc .fc-header-toolbar {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
  }

  #calendar .fc .fc-toolbar-chunk {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-width: 0;
    width: 100%;
  }

  #calendar .fc .fc-toolbar-title {
    font-size: clamp(0.9rem, 4.8vw, 1.1rem);
    line-height: 1.2;
    text-align: center;
    margin: 0 !important;
    word-break: normal;
    overflow-wrap: anywhere;
  }

  #calendar .fc .fc-header-toolbar .fc-toolbar-chunk:first-child {
    justify-content: flex-start;
  }

  #calendar .fc .fc-header-toolbar .fc-toolbar-chunk:last-child {
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }

  #calendar .fc .fc-header-toolbar .fc-toolbar-chunk:last-child::-webkit-scrollbar {
    display: none;
  }

  #calendar .fc .fc-button {
    padding: 0.33rem 0.52rem;
    font-size: 0.78rem;
    line-height: 1.15;
    white-space: nowrap;
    border-radius: 9px;
  }

  #calendar .fc .fc-button-group {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 0.35rem;
  }

  #calendar .fc .fc-col-header-cell-cushion {
    font-size: 0.75rem;
    padding: 0.25rem 0.15rem;
  }

  #calendar .fc .fc-daygrid-day-number {
    font-size: 0.8rem;
    padding: 0.2rem;
  }

  #calendar .fc .fc-daygrid-day-frame {
    min-height: 108px;
  }

  #calendar .fc .fc-daygrid-body-natural .fc-daygrid-day-events {
    margin-bottom: 0;
  }

  .rv-cal-scroll {
    overflow: auto;
    max-height: min(72vh, 660px);
    height: min(72vh, 660px);
    border-radius: 10px;
    -webkit-overflow-scrolling: touch;
  }

  #calendar .fc .fc-scrollgrid,
  #calendar .fc .fc-view-harness {
    min-width: 720px;
    min-height: 0 !important;
  }

  #calendar .fc {
    min-width: 720px;
  }

  .rv-cal-drawer {
    display: none;
  }
}

@media (max-width: 575.98px) {
  .calendar-page .container-xxl,
  .calendar-page {
    padding-left: 0.35rem;
    padding-right: 0.35rem;
  }

  .rv-cal-nav .btn {
    min-width: 34px;
    padding: 0.3rem 0.46rem;
    font-size: 0.78rem;
  }

  .rv-qa-label {
    display: none;
  }

  .calendar-new-event-btn {
    width: 38px;
    height: 34px;
    padding: 0;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .rv-cal-scroll {
    max-height: 76vh;
    height: 76vh;
  }
}

@media (min-width: 1200px) {
  .rv-cal-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .rv-cal-layout.drawer-open {
    grid-template-columns: minmax(0, 1fr) 360px;
  }

  .rv-cal-drawer {
    position: sticky;
    top: calc(var(--topbar-h, 0px) + 18px);
  }
}
.breadcrumb a {
  text-decoration: none;
  color: var(--primary-color);
}
.breadcrumb-item + .breadcrumb-item::before {
  content: "›";
}
.breadcrumb .active {
  color: #555;
}

.form-group {
  margin-bottom: 1rem;
}

.form-group>label {
  margin-bottom: 10px;
}

#delete-modal .modal-footer > .btn {
  border-radius: 3px !important; 
  padding: 0px 8px !important;
  font-size: 15px;
}

#calendar .fc .fc-timegrid-body .fc-scroller,
#calendar .fc .fc-list .fc-scroller {
  overflow-y: auto !important;
}

.context-menu {
  position: absolute;
  z-index: 1000;
  background-color: var(--rv-surface);
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
  padding: 5px;
}

.context-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.context-menu ul>li {
  padding: 5px 15px;
  color: #333;
  cursor: pointer;
  font-size: 13px;
  transition: 0.1s;
}

.context-menu ul>li:hover {
  color: #fff;
  background-color: #007bff;
  border-radius: 2px;
}

.fa,
.fas {
  font-size: 13px;
  margin-right: 4px;
}

/* Custom outline button */
.btn-outline-brand {
  display: inline-block;
  font-weight: 500;
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  background-color: transparent;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease-in-out;
}

.btn-outline-brand:hover,
.btn-outline-brand:focus {
  color: var(--white-color);
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  text-decoration: none;
}

.btn-custom {
  display: inline-block;
  padding: 10px 20px;
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-large);
  border: none;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  background-color: var(--primary-color);
}

.btn-custom:hover {
  background-color: var(--custom-btn-bg-color);
  color: var(--white-color);
}

.btn-custom-outline {
  display: inline-block;
  padding: 10px 20px;
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-large);
  border: 2px solid var(--custom-btn-bg-color);
  background-color: transparent;
  color: var(--custom-btn-bg-color);
  transition: all 0.3s ease-in-out;
}

.btn-custom-outline:hover {
  background-color: var(--custom-btn-bg-color);
  color: var(--white-color);
}
/* Απόκρυψη της αναζήτησης κάτω από 768px */
@media (max-width: 767.98px) {
  .header-form {
    display: none !important;
  }
}

@media (max-width: 992px) {
  .rv-footer {
    padding-top: 0px!important;
    margin-top: 0px!important;
  }
  .contact-form {
    margin-bottom: 45px;
  }
  .rv-footer .right-content {
    text-align: center;
  }
  .rv-footer .footer-content {
    padding: 60px 0px!important;
  }
}

.rv-footer {
  
  z-index: 1;
  margin-top: 200px;
  padding-top: 120px;
  background-image: url("../images/lava/footer-bg.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 100%;
}

.rv-footer .footer-content {
  padding: 120px 0px;
}
.rv-footer .a {
  color: var(--white-color) !important;
  font-weight: var(--font-weight-bold);
  text-decoration: none;
}

.app-footer {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  /* IMPORTANT: allow flex layouts (`mt-auto`) to push footer to the bottom. */
  margin-top: auto !important;
  padding-top: 0.65rem !important;
  background: color-mix(in srgb, var(--rv-surface-alt) 88%, #ffffff) !important;
  background-image: none !important;
  border-top: 1px solid var(--rv-border-subtle);
}

.app-footer .container {
  max-width: 980px;
}

.app-footer .app-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.85rem;
}

.app-footer .app-footer-links a {
  color: var(--p-color);
  font-size: 0.9rem;
}

.app-footer .app-footer-copy {
  color: var(--p-color);
  font-size: 0.88rem;
}

@media (max-width: 575.98px) {
  .app-footer {
    padding-top: 0.55rem !important;
    padding-bottom: 0.6rem !important;
  }

  .app-footer .app-footer-links {
    gap: 0.55rem;
  }

  .app-footer .app-footer-links a,
  .app-footer .app-footer-copy {
    font-size: 0.82rem;
  }
}

  form select {
    padding: 5px 10px;
    margin: 10px;
    font-size: 16px;
  }

  /* Γενικά styles για dropdown με σημαίες */
.language-select {
  background-position: 8px center;
  background-repeat: no-repeat;
  padding-left: 32px;
  background-size: 20px 14px;
}

/*---------------------------------------
  LANGUAGE SELECT STYLES
-----------------------------------------*/

/* 🔘 Στρογγυλή σημαία με cover fit */
.lang-flag-icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  background-color: transparent; /* Διαφανές φόντο */
  box-shadow: none; /* χωρίς περίγραμμα/σκιά */
}

/* 💻 Στο dropdown του desktop (select) */
.language-select {
  background-position: 8px center;
  background-repeat: no-repeat;
  background-size: 20px 14px;
  padding-left: 32px;
  border-radius: 10px;
  border: 1px solid #ccc;
}

/* 🇬🇷 Ελλάδα */
.language-select.el {
  background-image: url('/static/images/flag/gr.png');
}

/* 🇬🇧 Αγγλία */
.language-select.en {
  background-image: url('/static/images/flag/gb.png');
}

/* 📱 Σε κινητά: Μόνο σημαία, χωρίς κείμενο */
@media (max-width: 767.98px) {
  .language-select {
    color: transparent;
    text-shadow: 0 0 0 #000;
    width: 40px;
    padding-left: 0;
    background-position: center;
    background-color: transparent;
    box-shadow: none;
    border: none;
  }
}




@media (max-width: 767.98px) {
  .navbar {
    flex-wrap: nowrap !important;
    padding: 0.5rem 1rem !important;
    justify-content: space-between !important;
    align-items: center;
  }

  .navbar .navbar-brand img {
    height: 42px; 
  }

  .header-form,
  .navbar .nav-item:not(.dropdown):not(:last-child),
  .navbar .dropdown.ps-3,
  .navbar .dropdown.ps-1 {
    display: none !important;
  }

  .navbar .dropdown,
  .navbar .dropdown.px-3,
  .navbar .btn {
    padding: 0 4px;
  }
}
.sub-btn {
  display: inline-block;
  padding: 10px 20px;
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-large);
  border: 2px solid var(--custom-btn-bg-color);
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  background-color: var(--custom-btn-bg-color);
}
.btn-sub {
  display: inline-block;
  padding: 10px 20px;
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-large);
  border: none;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  text-align: center;
  text-decoration: none;
  color: #414141;
  background-color: var(--custom-btn-bg-color);
}

.btn-sub:hover {
  background-color: var(--primary-color);
  color: var(--white-color);
}

/* CTA button (header) */
.cta-btn {
  background-color: #A8DADC;   /* default */
  color: #fff !important;
  border: 0;
  border-radius: 12px;          /* 10–20px range, διάλεξα 12px */
  padding: 0.45rem 0.9rem;
  font-weight: 600;
  line-height: 1.2;
}
.cta-btn:hover,
.cta-btn:focus {
  background-color: #E07A5F;   /* hover */
  color: #fff !important;
}

/* Language select να “δένει” με τα nav links */
.nav-language-form { margin-left: .5rem; }
.nav-language {
  height: 34px;
  padding: 0 .5rem;
  font-size: .875rem;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,.1);
}

    :root { --sb-collapsed: 64px; --sb-expanded: 240px; --topbar-h: 72px; --brand-grey: #4b5058; }

    /* Topbar  */
    header.topbar { position: sticky; top: 0; z-index: 1030; height: var(--topbar-h); background: var(--rv-surface); border-bottom: 1px solid rgba(0,0,0,.06); display: flex; align-items: center; justify-content: flex-end; padding: 0 .95rem; margin-right: 0; }
    .topbar .brand-center { position: absolute; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; }
    .topbar .brand-center img { height: 48px; }
    .topbar .top-actions { position: absolute; right: 1rem; display: inline-flex; align-items: center; gap: .75rem; }
    .topbar-mobile-menu { display: none; }
   
    /* Global mini Sidebar */
/* πριν: inset: var(--topbar-h) auto 0 0; height: calc(100vh - var(--topbar-h)); z-index: 1029;  */
#miniSidebar {
  position: fixed;
  inset: 0 auto 0 0;       
  width: var(--sb-collapsed);
  height: 100vh;           
  background: var(--brand-grey);
  color: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,.15);
  transition: width .2s ease-in-out;
  z-index: 1200;
  overflow: hidden;
}



    #miniSidebar:hover { width: var(--sb-expanded); }
    #miniSidebar .brand { height: 56px; display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; border-bottom: 1px solid rgba(255,255,255,.15); }
    #miniSidebar .brand img { width: 28px; height: 28px; }
    #miniSidebar ul {
      list-style: none;
      margin: 0;
      padding: .5rem;
      height: 100%;
      min-height: 0;
      display: flex;
      flex-direction: column;
      padding-top: var(--topbar-h);
      padding-bottom: .75rem;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-gutter: stable;
      -webkit-overflow-scrolling: touch;
    }
    #miniSidebar li a, #miniSidebar li form button { display: flex; align-items: center; gap: .875rem; padding: .6rem .75rem; color: #fff; text-decoration: none; border-radius: .5rem; background: none; border: none; width: 100%; text-align: left; }
    #miniSidebar li a:hover, #miniSidebar li form button:hover { background: rgba(255,255,255,.12); }
    #miniSidebar li a.active { background: rgba(255,255,255,.2); font-weight: 600; box-shadow: inset 2px 0 0 rgba(255,255,255,.9); }
    #miniSidebar .icon { font-size: 1.2rem; width: 24px; text-align: center; }
    #miniSidebar .label { opacity: 0; white-space: nowrap; pointer-events: none; transition: opacity .15s ease; }
    #miniSidebar:hover .label { opacity: 1; pointer-events: auto; }

    /* Content push */
    .dash-main { margin-left: var(--sb-collapsed); transition: margin-left .2s ease-in-out; padding: 1.25rem; }
    #miniSidebar:hover ~ .dash-main { margin-left: var(--sb-expanded); }

    /* Container width */
    .dash-container { max-width: 1500px; }

@media (max-width: 991.98px) {
  #miniSidebar { display: none !important; }
}
/* Fade background (Bootstrap το έχει, εδώ απλά το κάνουμε λίγο πιο σκούρο) */
.modal-backdrop.show {
  background-color: rgba(0, 0, 0, 0.55);
}

/* Modal box styling */
#settingsModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}

/* Header & footer */
#settingsModal .modal-header,
#settingsModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}

#settingsModal .modal-title {
  font-weight: 600;
}

/* Tabs */
#settingsModal .nav-tabs{
  border-bottom: 1px solid var(--border-color);
  background: var(--section-bg-color);
  border-radius: 12px;
  padding: .4rem;
  gap: .35rem;
}

#settingsModal .nav-tabs .nav-link {
  border: 1px solid transparent !important;
  border-radius: 10px;
  color: var(--p-color) !important;
  font-weight: 600;
  padding: .5rem .9rem;
  background: transparent !important;
}

#settingsModal .nav-tabs .nav-link:hover{
  background: var(--white-color) !important;
  color: var(--heading-color) !important;
}

#settingsModal .nav-tabs .nav-link.active {
  background: var(--secondary-color) ;
  border-color: var(--secondary-color);
  color: var(--heading-color);
  box-shadow: none ;
}

#settingsModal .settings-apply-btn{
  min-width: 128px;
}

#settingsModal .btn-outline-brand:hover,
#settingsModal .btn-accent:hover{
  transform: none;
}

/* Body content spacing */
#settingsModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#settingsModal .modal-title {
  padding: 1.25rem;
}

/* === Settings Modal: fixed size box with internal scroll === */
:root{
  --settings-modal-w: 840px;   
  --settings-modal-h: 72vh;    
}

#settingsModal .modal-dialog{
  max-width: var(--settings-modal-w);
  margin: 1.75rem auto;        /* κλασικό bootstrap spacing */
}

#settingsModal .modal-content{
  height: var(--settings-modal-h);  /* σταθερό ύψος για να μην αλλάζει */
  display: flex;
  flex-direction: column;      /* header/body/footer σε στήλη */
}

#settingsModal .modal-header,
#settingsModal .modal-footer{
  flex: 0 0 auto;              /* δεν τεντώνονται */
}
#settingsModal .modal-footer {
 
  align-items: center;
  gap: .5rem;

}

#settingsModal .modal-body{
  flex: 1 1 auto;              /* πιάνει το διαθέσιμο ύψος */
  overflow: auto;              /* εσωτερικό scroll όταν έχει πολύ περιεχόμενο */
  min-height: 320px;           /* για να μη “πηδάει” σε tabs με λίγο περιεχόμενο */
}

/* Στα tabs, κρατάμε ένα ελάχιστο ύψος για να μη μικραίνει από tab σε tab */
#settingsModal .tab-pane{
  min-height: 260px;
}

/* Responsive: σε μικρές οθόνες να πιάνει σχεδόν όλο το πλάτος, όχι full screen */
@media (max-width: 991.98px){
  :root{
    --settings-modal-w: 95vw;
    --settings-modal-h: 78vh;  /* λίγο ψηλότερο στο mobile */
  }
  #settingsModal .modal-dialog{
    max-width: var(--settings-modal-w);
  }
}

#emotionModal .modal-content {
  border-radius: 12px;        
  border: 1px solid #ddd;     
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#emotionModal .modal-header,
#emotionModal .modal-footer {
  border: none;               
  background: #f1f1f1;        
}
#emotionModal .modal-title {
  font-weight: 600;
}
#emotionModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#emotionModal .modal-title {
  padding: 1.25rem;
}
#quickNoteModal .modal-content {
  border-radius: 12px;        
  border: 1px solid #ddd;     
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#quickNoteModal .modal-header,
#quickNoteModal .modal-footer {
  border: none;               
  background: #f1f1f1;        
} 
#quickNoteModal .modal-title {
  font-weight: 600;
}
#quickNoteModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#quickNoteModal .modal-title {
  padding: 1.25rem;
}
#financeModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#financeModal .modal-header,
#financeModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#financeModal .modal-title {
  font-weight: 600;
}
#financeModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#financeModal .modal-title {
  padding: 1.25rem;
}
#financeModal .tr {
  vertical-align: middle;
  padding: .75rem;
  border-top: 1px solid var(--border-color);
  height: 48px;

}
/* 2) Scroll container για τον πίνακα */
#financeModal .table-responsive {
  max-height: 52vh;        /* κάθετο scroll εντός modal */
  overflow: auto;          /* οριζόντιο + κάθετο */
  border: 1px solid var(--border-color);
  border-radius: 10px;
}

/* 3) Ο πίνακας να έχει min-width ώστε να μην “στριμώχνονται” τα inputs */
#financeModal table {
  min-width: 900px;
       /* θα ενεργοποιήσει horizontal scroll όπου χρειάζεται */
}
#financeModal thead th {
  position: sticky; top: 0;
  background: var(--rv-surface); z-index: 2;
  border-bottom: 1px solid var(--border-color);
}
#financeModal th, 
#financeModal td {
  vertical-align: middle;
  white-space: nowrap;      /* αποτρέπει σπάσιμο labels */
}

/* Inputs 100% πλάτος στο κελί */
#financeModal input.form-control,
#financeModal select.form-select {
  width: 100%;
  height: calc(1.5em + .75rem + 2px); /* ίδιο ύψος με το default Bootstrap */
  padding: .375rem .75rem;
}

/* Διακριτικά πλάτη ανά στήλη (προαιρετικά) */
#financeModal td:nth-child(1) { width: 140px; } /* Τύπος */
#financeModal td:nth-child(2) { width: 220px; } /* Κατηγορία */
#financeModal td:nth-child(3) { width: 140px; } /* Ποσό */
#financeModal td:nth-child(4) { min-width: 260px; } /* Σημείωση */

/* Κουμπί διαγραφής πιο “λεπτό” */
#financeModal td:last-child .btn {
  padding: .25rem .5rem;
  line-height: 1;
}

#financeModal .fw-bold {
  align-items: center;
  gap: .5rem;

  margin: 0;
  padding: 20px;
}

#notesModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#notesModal .modal-header,
#notesModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#notesModal .modal-title {
  font-weight: 600;
}
#notesModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#notesModal .modal-title {
  padding: 1.25rem;
}


/* ---- Header ---- */
.profile-cover{
  position:relative;
  height:360px;
  border-radius:14px;
  overflow:visible;
  z-index: 2;
}
.profile-cover-trigger{
  position:absolute;
  right:14px;
  top:14px;
  z-index:2;
  border:1px solid rgba(255,255,255,.8);
  background: rgba(12, 25, 46, 0.58);
  color:#fff;
  border-radius: 999px;
  padding: .34rem .62rem;
  font-size: .8rem;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
.profile-cover-trigger:hover{
  background: rgba(12, 25, 46, 0.72);
}
.profile-avatar-trigger{
  position:absolute;
  left:24px;
  bottom:14px;
  width:132px;
  height:132px;
  padding:0;
  border:none;
  background:transparent;
  border-radius:50%;
  z-index:3;
}
.profile-avatar{
  position:static;
  width:132px; height:132px; border-radius:50%;
  border:4px solid var(--white-color);
  background: var(--section-bg-color);
  object-fit:contain;
  object-position:center;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.profile-avatar-badge{
  position:absolute;
  right:6px;
  bottom:6px;
  width:28px;
  height:28px;
  border-radius:50%;
  background: var(--primary-color);
  color:#fff;
  border:2px solid #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.78rem;
}
/* Phase 12: Removed absolute positioning, buttons now below cover */
.profile-actions{
  display:flex; gap:.5rem; flex-wrap:wrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
}
.profile-actions-row{
  margin-top: 70px;
  display:flex;
  justify-content:flex-end;
}
.profile-actions form{
  margin: 0;
  display: inline-flex;
}
.profile-actions{
  flex-wrap: wrap;
  overflow: visible;
  padding-bottom: 0;
}
.profile-actions::-webkit-scrollbar{
  height: 0;
}

.profile-actions .btn {
  white-space: nowrap;
}

/* Buttons – scoped για να μην επηρεάσεις όλο το site */
.profile-actions .btn-primary,
.profile-tabs .btn-primary,
.media-activity .btn-primary,
.profile-actions .btn-accent,
.profile-tabs .btn-accent,
.media-activity .btn-accent{
  background:var(--primary-color);
  border-color:var(--primary-color);
}
.profile-actions .btn-primary:hover,
.profile-tabs .btn-primary:hover,
.media-activity .btn-primary:hover,
.profile-actions .btn-accent:hover,
.profile-tabs .btn-accent:hover,
.media-activity .btn-accent:hover{
  filter:brightness(.95);
}

.profile-actions .btn-outline-primary,
.profile-tabs .btn-outline-primary,
.media-activity .btn-outline-primary,
.profile-actions .btn-outline-brand,
.profile-tabs .btn-outline-brand,
.media-activity .btn-outline-brand{
  color:var(--primary-color);
  border-color:var(--primary-color);
  background:transparent;
}
.profile-actions .btn-outline-primary:hover,
.profile-tabs .btn-outline-primary:hover,
.media-activity .btn-outline-primary:hover,
.profile-actions .btn-outline-brand:hover,
.profile-tabs .btn-outline-brand:hover,
.media-activity .btn-outline-brand:hover{
  background:var(--primary-color);
  color:#fff;
}

/* το .btn-outline-brand να «γεμίζει» όταν είναι checked */
.btn-check:checked + .btn.btn-outline-brand {
  background: var(--primary-color);
  color: #fff;
  border-color: var(--primary-color);
}
.btn-check:focus + .btn.btn-outline-brand {
  box-shadow: 0 0 0 .2rem rgba(11,64,156,.15); /* προσαρμόζεται στο brand */
}


/* Δεύτερο CTA (Accent) */
.btn-accent{
  background: var(--custom-btn-bg-color);
  border-color: var(--custom-btn-bg-color);
  color:#1b1b1b;
  display: inline-block;
  font-weight: 500;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease-in-out;
}
.btn-accent:hover{
  background: var(--custom-btn-bg-hover-color); /* #1D3557 */
  border-color: var(--custom-btn-bg-hover-color);
  color:#fff;
  filter:none;
}

/* ---- Header Bar (name + stats + tabs) ---- */
.profile-bar{
  margin-top:1rem !important;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1rem;
  align-items:start;
  position: relative;
  z-index: 1;
}
.name-and-stats h2{ margin:0; color:var(--heading-color); }
.name-and-stats{ min-width: 0; }
.name-and-stats .stats{
  display:flex; gap:1rem; flex-wrap:wrap;
  color:var(--p-color); font-size:.95rem;
}
.stats .stat strong{ color:var(--dark-color); }

/* Tabs */
.profile-tabs{ grid-column: 1 / -1; }
.profile-tabs .nav{
  display:flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: .15rem;
}
.profile-tabs .nav::-webkit-scrollbar{ display:none; }
.profile-tabs .nav-item{ flex: 0 0 auto; }
.profile-tabs .nav-link{ font-weight:600; color:var(--p-color); }
.profile-tabs .nav-link.active{
  border-bottom:3px solid var(--heading-color) !important;
  color:var(--heading-color) !important;
  background:transparent !important;
}

@media (max-width: 991.98px){
  .profile-cover{
    overflow: visible;
  }
  .profile-actions-row{
    margin-top: 56px;
    justify-content:flex-start;
  }
  .profile-bar{
    margin-top:0.9rem !important;
    grid-template-columns:1fr;
  }
  .profile-actions{
    justify-content:flex-start;
    gap: .45rem !important;
  }
  .profile-actions .btn{
    padding: .38rem .58rem;
    font-size: .82rem;
  }
}

@media (max-width: 575.98px){
  .profile-cover{
    height:300px;
  }
  .profile-avatar-trigger{
    width:88px;
    height:88px;
    left:12px;
    bottom:10px;
  }
  .profile-avatar{
    width:88px;
    height:88px;
  }
  .profile-avatar-badge{
    width:22px;
    height:22px;
    font-size:.66rem;
    right:2px;
    bottom:2px;
  }
  .profile-cover-trigger{
    right:10px;
    top:10px;
    padding: .28rem .5rem;
    font-size: .72rem;
  }
  .profile-bar{ margin-top: .9rem !important; }
  .profile-actions-row{
    margin-top: 34px;
    width: 100%;
  }
  .profile-actions{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
  .profile-actions form {
    width: 100%;
  }
  .profile-actions .btn {
    width: 100%;
    white-space: normal;
    line-height: 1.2;
    min-height: 42px;
  }

  .profile-tabs .nav-link{
    white-space: nowrap;
    padding: .5rem .75rem;
    font-size: .95rem;
  }
}

/* Cards / Lists */
.card{ border-radius:14px; background:var(--white-color); border-color:var(--border-color); }
.list-group-item{ border:none; border-bottom:1px solid var(--border-color); }

/* Media & Activity section */
.media-activity .card{ border-radius:14px; }
.media-activity .section-title{ font-weight:700; color:var(--heading-color); }


.thumb{
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
  background: #f4f6f8;
  aspect-ratio: 1 / 1;
  line-height: 0; 
}

.thumb img,
.thumb video{
  width: 100%;
  height: 100%;
  object-fit: contain;   
  object-position: center;
  display: block;
  transition: transform .3s ease;
}

.thumb:hover img,
.thumb:hover video{
  transform: scale(1.28); 
}
.profile-cover:hover .profile-avatar{
  transform: scale(1.25);
}

.thumb .badge-tag{
  position: absolute; right: 8px; bottom: 8px;
  border-radius: 999px; background: var(--primary-color);
  color:#fff; padding:4px 10px; font-size:.75rem;
}


.activity-item{
  display:flex; gap:.75rem; align-items:flex-start; padding:.75rem 0;
  border-bottom:1px solid var(--border-color);
}
.activity-item:last-child{ border-bottom:0; }
.activity-bullet{
  width:10px; height:10px; margin-top:.45rem; border-radius:50%;
  background: var(--primary-color);
  flex:0 0 10px;
}
.sticky-side{ position:sticky; top:84px; }

.card-title, .section-title { color: var(--heading-color); }
a:hover { color: var(--link-hover-color); }

.form-help{ font-size:.8rem; color:#6c757d; }

/* ===== Gallery – add-on styles (append at end) ===== */

/* 1) Sticky top bar wrapper */
.gallery-topbar{
  position: sticky; top: 0; z-index: 1030;
  background: var(--white-color);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  padding: .5rem .75rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

/* 2) Filter chips */
.filter-chip{
  --chip-bg: transparent;
  --chip-bd: var(--primary-color);
  --chip-fg: var(--primary-color);
  border: 1.5px solid var(--chip-bd);
  background: var(--chip-bg);
  color: var(--chip-fg);
  border-radius: 999px;
  padding: .25rem .6rem;
  line-height: 1;
  font-weight: 600;
}
.filter-chip:hover,
.filter-chip.active{
  background: color-mix(in srgb, var(--primary-color) 10%, transparent);
  border-color: var(--primary-color);
  color: var(--dark-color);
}

/* 3) Image card hover actions (on top of your .thumb) */
.media-item{
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  background: #f4f6f8;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.media-item .img-actions{
  position: absolute; left:0; right:0; bottom:0;
  display:flex; gap:.35rem; justify-content:center;
  padding:.5rem;
  background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
  transform: translateY(100%); opacity: 0; transition: .18s ease;
}
@media (hover:hover){
  .media-item:hover .img-actions{ transform: translateY(0); opacity: 1; }
}
.media-item .btn-action{
  background:var(--rv-surface); border:1px solid var(--rv-border-subtle); color:var(--rv-text);
  padding:.25rem .5rem; border-radius:8px;
}
.media-item .btn-action:hover{ filter: brightness(.96); }

/* Προαιρετικό badge πάνω δεξιά (όταν δεν χρησιμοποιείς .badge-tag) */
.badge-type{
  position:absolute; top:.5rem; right:.5rem;
  background:#000; color:#fff; text-transform:uppercase;
  letter-spacing:.03em; border-radius:8px; padding:.15rem .4rem;
  font-size:.72rem;
}

/* 4) Skeleton shimmer */
.skeleton{
  background: linear-gradient(90deg,#e9edf3 25%,#f5f7fb 37%,#e9edf3 63%);
  background-size: 400% 100%;
  animation: gallery-shimmer 1.2s infinite linear;
  border-radius: 12px;
}
.skeleton.square{ aspect-ratio:1/1; }
@keyframes gallery-shimmer{
  0%{ background-position: 100% 0; }
  100%{ background-position: -100% 0; }
}

/* 5) Timeline headings */
.tl-month{
  font-weight: 700;
  color: var(--heading-color);
  margin: 1rem 0 .5rem;
}

/* 6) Lightbox (Bootstrap modal) – subtle tweaks */
#lightboxModal .modal-content{
  background:#000; border-radius: 12px;
}
#lightboxModal .btn{ border-radius: 10px; }

/* 7) Dark mode adaptations */
body.dark-mode .gallery-topbar{
  background: #1e1e1e; border-color:#333; box-shadow: none;
}
body.dark-mode .media-item{
  background:#222; box-shadow: 0 10px 24px rgba(0,0,0,.35);
}
body.dark-mode .skeleton{
  background: linear-gradient(90deg,#2a2a2a 25%,#333 37%,#2a2a2a 63%);
}
body.dark-mode .filter-chip{
  --chip-bd: var(--primary-color); --chip-fg: var(--primary-color);
}

/* Quick Composer */
.composer .card-body{ padding: .75rem; }
.composer-input{
  height: 44px; border-radius: 999px;
  padding-left: 14px; background: #f7f9fc;
}
.composer-input:focus{ background: var(--rv-surface); }

#photoModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#photoModal .modal-header,
#photoModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#photoModal .modal-title {
  font-weight: 600;
}
#photoModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#photoModal .modal-title {
  padding: 1.25rem;
}
#videoModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#videoModal .modal-header,
#videoModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#videoModal .modal-title {
  font-weight: 600;
}
#videoModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#videoModal .modal-title {
  padding: 1.25rem;
}
#quickLinkModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#quickLinkModal .modal-header,
#quickLinkModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#quickLinkModal .modal-title {
  font-weight: 600;
}
#quickLinkModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#quickLinkModal .modal-title {
  padding: 1.25rem;
}
#photoPickerModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#photoPickerModal .modal-header,
#photoPickerModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#photoPickerModal .modal-title {
  font-weight: 600;
}
#photoPickerModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#photoPickerModal .modal-title {
  padding: 1.25rem;
}

#eventModal .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#eventModal .modal-header,
#eventModal .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
#eventModal .modal-title {
  font-weight: 600;
}
#eventModal .modal-body {
  background: var(--rv-surface);
  padding: 1.5rem;
}
#eventModal .modal-title {
  padding: 1.25rem;
}
#modal-header .modal-content {
  border-radius: 12px;        /* στρογγυλεμένες γωνίες */
  border: 1px solid #ddd;     /* λεπτό περίγραμμα */
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  overflow: hidden;
}
#modal-header .modal-header,
#modal-header .modal-footer {
  border: none;               /* χωρίς default Bootstrap border */
  background: #f1f1f1;        /* ελαφρύ γκρι */
}
/* Restore Bootstrap grid inside Profile media section */
.media-activity .row {
  --bs-gutter-x: .5rem;
  --bs-gutter-y: .5rem;
  display: flex;
  flex-wrap: wrap;
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left:  calc(-.5 * var(--bs-gutter-x));
  margin-top:   calc(-.5 * var(--bs-gutter-y));
}
.media-activity .row > [class^="col-"],
.media-activity .row > [class*=" col-"] {
  padding-right: calc(.5 * var(--bs-gutter-x));
  padding-left:  calc(.5 * var(--bs-gutter-x));
  padding-top:   calc(.5 * var(--bs-gutter-y));

}

/* === Membership Modal === */

.membership-modal { border-radius:12px; border:1px solid #ddd; box-shadow:0 6px 20px rgba(0,0,0,.25); overflow:hidden; }
.membership-modal .modal-header { border:none; background:#f7f7f7; }
.membership-modal .modal-footer { border:none; background:#f7f7f7; }
.membership-modal .modal-body { background:var(--rv-surface); padding:1.5rem; }

/* Μονοστήλη ροή */
.membership-column { display:flex; flex-direction:column; gap:12px; }

/* Κάρτες ίδιου ύψους */
.membership-section {
  border-radius:12px;
  padding:16px;
  min-height: var(--ms-card-min-h, 320px); /* ρύθμισε αν χρειαστεί */
  display:flex; flex-direction:column; align-items:center; text-align:center;
}
.ms-title { font-weight:700; color:var(--heading-color, #1D3557); margin-bottom:.5rem; }
.ms-content { width:100%; max-width:900px; margin-inline:auto; }
.ms-content p, .ms-content li { font-size:0.95rem; }

/* Carousels μέσα σε sections */
.membership-section .carousel { width:100%; max-width:900px; margin:0 auto; }
.membership-section .carousel .carousel-item img { display:block; width:100%; height:260px; object-fit:cover; }

/* Εναλλασσόμενα backgrounds (ή βάλε τα brand colors σου) */
.bg-1  { background:#FFF6F2; }
.bg-2  { background:#F2FAFF; }
.bg-3  { background:#F9F9FF; }
.bg-4  { background:#FFF9F0; }
.bg-5  { background:#F4FFF8; }
.bg-6  { background:#F7F4FF; }
.bg-7  { background:#F0FFFC; }
.bg-8  { background:#FFF3F6; }
.bg-9  { background:#F4F8FF; }
.bg-10 { background:#FFFDF0; }

/* Προαιρετικό: κάνε όλα ακριβώς ίσου ύψους χωρίς εσωτερικό scroll */
@media (min-width: 576px){
  :root { --ms-card-min-h: 360px; } /* αύξησε αν θες */
}

/* Γενικό bar – αν θες φόντο, βάλε εδώ */
.member-text-bar {
  /* background: var(--navbar-bg-color, #fff);  // προαιρετικό */
  padding: -16px -20px;
}

/* Clickable περιοχή */
.member-cta {
  cursor: pointer;
  user-select: none;
  text-decoration: none;
  align-items: center;
}

/* Κίτρινο brand κείμενο & εικονίδιο */
.member-cta .member-text,
.member-cta .bi {
  color: var(--primary-color, #F2CC8F); /* το "κιτρινο-χρυσό" brand */
  text-decoration: inherit;
  font-weight: 200;

  font-size: small;
}

/* Hover/Focus states */
.member-cta:hover .member-text,
.member-cta:focus .member-text,
.member-cta:hover .bi,
.member-cta:focus .bi {
  filter: --border-radius-large(1.1);
  text-decoration: none;
  outline: none;

  color: var(--bs-info, #0dcaf0); /* προσαρμόζεται στο brand */
}

/* Membership Highlights */
#membership-highlights .badge {
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

.mh-card {
  border-radius: 12px;
  background: var(--rv-surface);
  border: 1px solid var(--border-color, #e0e0e5);
  padding: 16px;
  box-shadow: 0 6px 14px rgba(0,0,0,.06);
  transition: transform .2s ease, box-shadow .2s ease;
  text-align: left;
}
.mh-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}
.mh-icon {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--custom-btn-bg-color,#A8DADC);
  color: #fff; font-size: 20px; margin-bottom: 8px;
}
.mh-title {
  font-weight: 700;
  color: var(--heading-color,#1D3557);
  margin: 4px 0 6px;
}
.mh-text {
  color: var(--p-color,#4a4a4a);
  margin: 0;
}

.finance-type-select { min-width: 140px; }
@media (min-width: 576px){
  #entryForm .form-control, #entryForm .form-select { height: calc(2.5rem + 2px); }
}
#entryType { min-width: 160px; margin-top: 40px;}

/* === Reflect Box (Unique Journey) =============================== */
.mega-card{
  border: 1px solid var(--border-color);
  border-radius: 16px;
  background: var(--white-color);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

/* Οριζόντιο sub-nav με smooth scroll + pills */
.mega-card-subnav{
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 1rem;
  position: sticky;
  top: 0;               /* θα “κολλάει” στο πάνω μέρος της κάρτας */
  z-index: 2;
  background: inherit;
  border-bottom: 1px solid var(--border-color);
  padding: .5rem;
}
.subnav-scroll ul{
  overflow: auto;
  scrollbar-width: thin;
  gap: .5rem !important;
}
.subnav-scroll .nav-pills .nav-link{
  display: inline-flex; align-items: center; gap: .35rem;
  border: 1px solid var(--border-color);
  background: var(--rv-surface);
  color: var(--heading-color);
  border-radius: 999px;
  padding: .45rem .75rem;
  transition: .15s ease-in-out;
}
.subnav-scroll .nav-pills .nav-link .bi{ font-size: 1rem; line-height: 1; }
.subnav-scroll .nav-pills .nav-link:hover{
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--primary-color) 40%, var(--border-color));
}
.subnav-scroll .nav-pills .nav-link.active{
  display: inline-flex; align-items: center; gap: .35rem;
  background: color-mix(in srgb, var(--primary-color) 14%, #fff);
  border-color: var(--primary-color);
  color: var(--dark-color);
}

/* Δίστηλη διάταξη media+copy, mobile -> στοίβα */
.tab-layout{
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 1.25rem;
  padding: 1rem;
}
.tab-media img{
  width: 100%; height: auto;
  border-radius: 12px;
  object-fit: cover;
  aspect-ratio: 16/10;
  box-shadow: 0 8px 18px rgba(0,0,0,.05);
}
.tab-copy h3{ color: var(--heading-color); }
.feature-list{ margin: 0 0 1rem 0; }
.feature-list li{
  display: flex; align-items: center; gap: .5rem;
  padding: .25rem 0; color: var(--p-color);
}
.feature-list i{ color: var(--primary-color); }

/* Φόρμα (partial) */
.reflect-form .form-label{ margin: 10px; font-weight: 600; color: var(--heading-color); }
.reflect-form .form-control{
  border-radius: 10px;
  border-color: var(--border-color);
}
.reflect-form .form-control:focus{
  border-color: color-mix(in srgb, var(--primary-color) 50%, var(--border-color));
  box-shadow: 0 0 0 .15rem color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.reflect-form .btn{ margin: 10px; border-radius: 10px; }
.reflect-form .btn-accent{
  margin: 10px;
  background: var(--custom-btn-bg-color);
  border-color: var(--custom-btn-bg-color);
  color: #1b1b1b;
}
.reflect-form .btn-accent:hover{
  margin: 10px;
  background: var(--custom-btn-bg-hover-color);
  border-color: var(--custom-btn-bg-hover-color);
  color: #fff;
}
.reflect-form .btn-outline-brand{
  margin: 10px;
  border-width: 2px;
}

/* Mobile tweaks */
@media (max-width: 991.98px){
  .tab-layout{ grid-template-columns: 1fr; }
  .mega-card-subnav{ top: calc(var(--topbar-h, 0px) + 8px); } /* σέβεται το sticky topbar σου */
}

/* Dark mode προσαρμογές */
body.dark-mode .mega-card{ background:#1e1e1e; border-color:#333; box-shadow: none; }
body.dark-mode .subnav-scroll .nav-pills .nav-link{ background:#222; border-color:#333; color:#ddd; }
body.dark-mode .subnav-scroll .nav-pills .nav-link.active{ background: color-mix(in srgb, var(--primary-color) 20%, #222); }
body.dark-mode .tab-media img{ box-shadow: 0 10px 20px rgba(0,0,0,.35); }


/* === Reflect Daily Box === */
.reflect-daily-box {
  border: 1px solid var(--border-color);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  margin-top: 1.25rem;
}
.reflect-daily-header {
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--border-color);
  font-weight: 600;
  color: var(--heading-color);
}
.reflect-daily-item {
  padding: .9rem 1rem;
  border-top: 1px dashed var(--border-color);
}
.reflect-daily-item:first-child { border-top-style: solid; }
.reflect-daily-title {
  font-weight: 700;
  margin: 0 0 .25rem 0;
  color: var(--heading-color);
}
.reflect-daily-body {
  white-space: pre-wrap;          /* κράτα τα line breaks */
  font-size: .95rem;
  line-height: 1.5;
  color: var(--p-color);
}
body.dark-mode .reflect-daily-box { background: #1e1e1e; border-color:#333; box-shadow:none; }
body.dark-mode .reflect-daily-header { border-color:#333; }
body.dark-mode .reflect-daily-item { border-color:#333; }


/* Μην επιτρέπεις σε flex children να “σπρώχνουν” το card */
#finance-app .card .d-flex { min-width: 0; }
#finance-app .min-w-0 { min-width: 0; }

/* Επιπλέον φρένο στο month input αν χρειαστεί */
#finance-app input[type="month"].form-control {
  max-width: 140px; 
}

/* ================================================
   OPTIMIZED NAVBAR & LANGUAGE SWITCHER STYLES
   ================================================ */

/* Language Switcher */
.language-switcher select.form-select {
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.375rem 1.75rem 0.375rem 0.5rem;
  background-position: right 0.3rem center;
  transition: all 0.2s ease;
}

.language-switcher select.form-select:focus {
  box-shadow: 0 0 0 0.2rem rgba(224, 122, 95, 0.25);
  border-color: var(--primary-color);
}

.language-switcher select.form-select option {
  padding: 0.5rem;
}

/* Mobile Language Switcher */
.language-switcher-mobile select.form-select {
  font-size: 0.8rem;
  padding: 0.25rem 1.5rem 0.25rem 0.4rem;
}

/* Home Navbar Optimizations */
.rv-nav-osmo {
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
  border-radius: 0 !important;
}

.rv-nav-osmo .navbar-brand img {
  transition: transform 0.3s ease;
}

.rv-nav-osmo .navbar-brand:hover img {
  transform: scale(1.05);
}

.rv-nav-osmo .nav-link {
  font-weight: 600;
  color: var(--heading-color) !important;
  padding: 0.6rem 0.95rem;
  border-radius: 999px;
  transition: color 0.2s ease, background-color 0.2s ease;
}

.rv-nav-osmo .nav-link:hover {
  color: var(--primary-color) !important;
  background: rgba(224, 122, 95, 0.08);
}

.rv-home-navbar .navbar-toggler {
  border: 1.5px solid var(--border-color) !important;
  border-radius: 12px;
  padding: 0.45rem 0.55rem;
}

.rv-home-navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem rgba(224, 122, 95, 0.18);
}

@media (max-width: 991.98px) {
  .header-area.rv-home-header {
    padding: 0 !important;
    height: auto !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .header-area.rv-home-header .rv-home-navbar {
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .header-area.rv-home-header .rv-home-navbar .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .header-area.rv-home-header .language-switcher-mobile {
    width: 64px !important;
  }

  .header-area.rv-home-header .language-switcher-mobile .form-select {
    text-align: center;
    padding-left: 0.25rem;
    padding-right: 1rem;
    background-position: right 0.1rem center;
  }
}

.rv-home-navbar .rv-nav-link-ghost,
.rv-home-navbar .rv-nav-cta {
  min-height: 42px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  line-height: 1;
  white-space: nowrap;
}

.rv-home-navbar .rv-nav-link-ghost {
  min-width: 110px;
}

.rv-home-navbar .rv-nav-cta {
  min-width: 150px;
}

.rv-landing-cta-actions {
  display: inline-flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.rv-landing-cta-actions .btn {
  min-height: 44px;
  min-width: 140px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Base Navbar (Authenticated) Optimizations */
.topbar {
  min-height: 60px;
  transition: all 0.3s ease;
}

.topbar .brand-center {
  min-width: 0;
}

.topbar .top-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.topbar .top-actions .dropdown {
  display: inline-flex;
  align-items: center;
}

.topbar .top-actions .rv-profile-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
}

.topbar .top-actions .rv-profile-trigger img {
  width: 38px;
  height: 38px;
  object-fit: cover;
}

/* ========================================
   NOTIFICATIONS - Facebook-style Modern Design
   ======================================== */

.rv-notif-toggle {
  border: 0;
  background: #f0f2f5;
  color: #050505;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
}

.rv-notif-toggle:hover {
  background: #e4e6eb;
  transform: scale(1.05);
}

.rv-notif-toggle i {
  font-size: 1.25rem;
  line-height: 1;
  color: #050505;
}

.rv-notif-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 20px;
  height: 20px;
  border-radius: 10px;
  padding: 0 6px;
  background: linear-gradient(135deg, #E07A5F 0%, #f39150 100%);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  box-shadow: 0 2px 4px rgba(224, 122, 95, 0.3);
  animation: notifPulse 2s ease-in-out infinite;
}

@keyframes notifPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

.notifications-block-wrap {
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  overflow: hidden;
  min-width: 360px !important;
  max-width: 420px !important;
}

.notifications-block-wrap .dropdown-header {
  background: #fff;
  padding: 0;
}

.rv-notif-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #e4e6eb;
}

.rv-notif-header h6 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #050505;
  margin: 0;
}

.notifications-block-wrap .rv-notif-action-link {
  border: 0;
  background: transparent;
  color: #E07A5F;
  font-size: 0.875rem;
  font-weight: 600;
  padding: 0.25rem 0.5rem;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.notifications-block-wrap .rv-notif-action-link:hover {
  background: #f0f2f5;
  color: #f39150;
}

.notifications-block-wrap .rv-notif-filters {
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid #e4e6eb;
  display: flex;
  gap: 0.5rem;
  background: #fff;
}

.notifications-block-wrap .rv-notif-filter {
  border: none;
  background: #f0f2f5;
  color: #65676b;
  border-radius: 20px;
  padding: 0.4rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  transition: all 0.2s ease;
}

.notifications-block-wrap .rv-notif-filter:hover {
  background: #e4e6eb;
  color: #050505;
}

.notifications-block-wrap .rv-notif-filter-active {
  background: linear-gradient(135deg, #E07A5F 0%, #f39150 100%);
  color: #fff !important;
}

.notifications-block-wrap .rv-notif-filter-active:hover {
  background: linear-gradient(135deg, #f39150 0%, #E07A5F 100%);
  color: #fff;
}

.notifications-list {
  scrollbar-width: thin;
  scrollbar-color: #e4e6eb transparent;
  background: #f0f2f5;
}

.notifications-list::-webkit-scrollbar {
  width: 8px;
}

.notifications-list::-webkit-scrollbar-track {
  background: transparent;
}

.notifications-list::-webkit-scrollbar-thumb {
  background-color: #e4e6eb;
  border-radius: 4px;
}

.notifications-list::-webkit-scrollbar-thumb:hover {
  background-color: #ccd0d5;
}

.rv-notif-group-title {
  padding: 0.75rem 1.25rem 0.5rem;
  color: #65676b;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  background: #f0f2f5;
}

.rv-notif-item-wrap {
  border-bottom: none;
  margin: 0.25rem 0.5rem;
}

.rv-notif-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  background: white;
  border-radius: 10px;
  transition: all 0.2s ease;
  text-decoration: none;
  color: inherit;
}

.rv-notif-item:hover {
  background: #f0f2f5;
  transform: translateX(4px);
}

.rv-notif-item-unread {
  background: linear-gradient(90deg, rgba(224, 122, 95, 0.08) 0%, rgba(243, 145, 80, 0.08) 100%);
  border-left: 3px solid #E07A5F;
}

.rv-notif-item-unread:hover {
  background: linear-gradient(90deg, rgba(224, 122, 95, 0.12) 0%, rgba(243, 145, 80, 0.12) 100%);
}

.rv-notif-item-unread .rv-notif-content .small {
  font-weight: 600;
  color: #050505;
}

.rv-notif-icon {
  min-width: 40px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: linear-gradient(135deg, #E07A5F 0%, #f39150 100%);
  box-shadow: 0 2px 8px rgba(224, 122, 95, 0.25);
}

.rv-notif-icon i {
  font-size: 1.1rem;
  color: white;
}

.rv-notif-content {
  flex: 1;
  min-width: 0;
}

.rv-notif-content .small {
  color: #050505;
  font-size: 0.9375rem;
  line-height: 1.4;
  display: block;
}

.rv-notif-time {
  display: inline-block;
  margin-top: 0.25rem;
  color: #65676b;
  font-size: 0.8125rem;
  font-weight: 500;
}

.rv-notif-empty {
  padding: 3rem 1.5rem;
  text-align: center;
  background: #f0f2f5;
}

.rv-notif-empty i {
  color: #ccd0d5;
  margin-bottom: 0.75rem;
}

.rv-notif-empty small {
  color: #65676b;
  font-size: 0.9375rem;
}

/* Profile Dropdown Hover Effects */
.dropdown-menu .dropdown-item {
  transition: all 0.2s ease;
}

.dropdown-menu .dropdown-item:hover {
  background-color: var(--section-bg-color);
  padding-left: 1.25rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .topbar {
    padding: 0 1rem;
  }
  
  .rv-nav-osmo .navbar-brand img {
    height: 32px;
  }
}

@media (max-width: 991.98px) {
  .topbar-mobile-menu {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  header.topbar {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) minmax(46px, auto);
    height: 64px;
    justify-content: unset;
    padding: 0 .65rem 0 .45rem;
  }

  .topbar .brand-center {
    position: static;
    left: auto;
    transform: none;
    justify-self: center;
  }

  .topbar .brand-center .navbar-brand {
    margin: 0;
  }

  .topbar .brand-center img {
    height: 36px;
  }

  .topbar .top-actions {
    position: static;
    right: auto;
    justify-self: end;
    gap: .25rem !important;
    min-width: 0;
    padding-right: .2rem;
  }

  .topbar .top-actions .btn {
    padding: .35rem .4rem !important;
  }

  .topbar .top-actions .dropdown > button img {
    width: 34px !important;
    height: 34px !important;
  }

  .topbar .top-actions .dropdown > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 0;
  }

  .notifications-dropdown {
    min-width: min(92vw, 340px) !important;
    max-width: 92vw !important;
  }

  .profile-dropdown-menu {
    min-width: min(86vw, 260px) !important;
    max-width: 86vw !important;
  }

  #mobileTopbarMenu .list-group-item {
    border-left: 0;
    border-right: 0;
  }

  .rv-home-mobile-menu {
    width: min(88vw, 340px) !important;
  }

  .rv-home-mobile-links .list-group-item {
    border-left: 0;
    border-right: 0;
    border-top: 0;
    padding-left: 0;
    padding-right: 0;
    font-weight: 600;
    color: var(--heading-color);
  }

  .rv-home-mobile-links .list-group-item:last-child {
    border-bottom: 0;
  }

  .rv-home-navbar .container {
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
  }

  .rv-home-navbar .language-switcher-mobile {
    width: 96px !important;
  }

  .rv-home-nav-collapse {
    margin-top: 0.8rem;
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 10px 26px rgba(15, 39, 67, 0.08);
  }

  .rv-home-nav-collapse .rv-nav-links {
    width: 100%;
    align-items: flex-start !important;
    margin-bottom: 0.65rem;
  }

  .rv-home-nav-collapse .rv-nav-links .nav-item,
  .rv-home-nav-collapse .navbar-nav.ms-auto .nav-item {
    width: 100%;
  }

  .rv-home-nav-collapse .rv-nav-links .nav-link {
    display: block;
    border-radius: 10px;
    padding: 0.7rem 0.75rem;
  }

  .rv-home-nav-collapse .navbar-nav.ms-auto {
    width: 100%;
    margin-top: 0.4rem;
    gap: 0.6rem;
    align-items: stretch !important;
  }

  .rv-home-navbar .rv-nav-link-ghost,
  .rv-home-navbar .rv-nav-cta {
    width: 100%;
    margin: 0 !important;
  }

  .rv-landing-cta-actions {
    width: 100%;
    justify-content: stretch;
  }

  .rv-landing-cta-actions .btn {
    flex: 1 1 100%;
    width: 100%;
    margin: 0 !important;
  }
}

/* Dark Mode Navbar */
body.dark-mode .topbar {
  background: #1e1e1e;
  border-color: #333;
}

body.dark-mode .rv-nav-osmo {
  background: rgba(30, 30, 30, 0.95);
  border-color: #333;
}

body.dark-mode .language-switcher select.form-select {
  background-color: #2a2a2a;
  color: #ddd;
  border-color: #444;
}

body.dark-mode .dropdown-menu {
  background: #2a2a2a;
  border-color: #444;
}

body.dark-mode .dropdown-item {
  color: #ddd;
}

body.dark-mode .dropdown-item:hover {
  background-color: #333;
}

body.dark-mode .notifications-block-wrap .dropdown-header {
  background: #1e1e1e;
  border-color: #444;
}

/* Reflect AI dark-mode polish */
.reflect-ai-shell .reflect-ai-card {
  background: var(--rv-surface);
  border: 1px solid var(--rv-border-subtle);
}

.reflect-ai-shell .reflect-ai-card .card-body,
.reflect-ai-shell .reflect-ai-card .card-body * {
  min-width: 0;
}

.reflect-ai-shell .reflect-ai-card .text-muted,
.reflect-ai-shell .reflect-ai-card .small.text-muted,
.reflect-ai-shell .reflect-ai-card .form-label.text-muted {
  color: var(--rv-text-muted) !important;
}

.reflect-ai-shell .reflect-ai-bubble {
  border: 1px solid transparent;
}

.reflect-ai-shell .reflect-ai-bubble-assistant {
  background: var(--rv-surface-alt);
  color: var(--rv-text);
  border-color: var(--rv-border-subtle);
}

.reflect-ai-shell .reflect-ai-bubble-user {
  background: var(--primary-color);
  color: #ffffff;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card {
  background: #101728;
  border-color: #2a3248;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32) !important;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .card-body {
  color: var(--rv-text);
  border-color: #2a3248 !important;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .border,
body.dark-mode .reflect-ai-shell .reflect-ai-card .list-group-item,
body.dark-mode .reflect-ai-shell .reflect-ai-card .list-group,
body.dark-mode .reflect-ai-shell .reflect-ai-card hr {
  border-color: #2a3248 !important;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .bg-light-subtle {
  background: #151f36 !important;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .form-select,
body.dark-mode .reflect-ai-shell .reflect-ai-card .form-control {
  background: #0c1324;
  color: var(--rv-text);
  border-color: #2a3248;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .form-select:focus,
body.dark-mode .reflect-ai-shell .reflect-ai-card .form-control:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 0.18rem rgba(243, 145, 80, 0.2);
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .btn-outline-secondary {
  color: #d5dbef;
  border-color: #3a4460;
}

body.dark-mode .reflect-ai-shell .reflect-ai-card .btn-outline-secondary:hover {
  color: #ffffff;
  background: #2d3855;
  border-color: #4a5678;
}

.reflect-ai-shell .reflect-task-add-btn,
.reflect-ai-shell .reflect-task-clear-btn,
.reflect-ai-shell .reflect-send-btn {
  white-space: nowrap;
}

.reflect-ai-shell .reflect-task-add-form .reflect-task-input,
.reflect-ai-shell .reflect-chat-form .reflect-chat-input {
  min-width: 0;
}

@media (max-width: 767.98px) {
  .reflect-ai-shell .reflect-ai-header h1 {
    font-size: 1.1rem;
  }

  .reflect-ai-shell .reflect-quick-prompts {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  .reflect-ai-shell .reflect-chip {
    width: 100%;
    justify-content: flex-start;
    text-align: left;
    line-height: 1.3;
    padding: 0.45rem 0.6rem;
  }

  .reflect-ai-shell .reflect-task-header {
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
  }

  .reflect-ai-shell .reflect-task-header form {
    margin-left: auto;
  }

  .reflect-ai-shell .reflect-task-clear-btn {
    min-width: 102px;
  }

  .reflect-ai-shell .reflect-task-add-form,
  .reflect-ai-shell .reflect-chat-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem;
  }

  .reflect-ai-shell .reflect-task-add-btn {
    min-width: 76px;
    padding-inline: 0.65rem;
  }

  .reflect-ai-shell .reflect-send-btn {
    min-width: 108px;
    padding-inline: 0.8rem;
  }
}

/* ==========================================
   MOBILE NAVIGATION (Phase 11)
   ========================================== */
.rv-mobile-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: var(--rv-mobile-nav-h, 68px);
  background-color: var(--navbar-bg-color, #ffffff);
  border-top: 1px solid var(--border-color, #e0e0e5);
  z-index: 1000;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.05);
  display: none !important;
}

.rv-mobile-nav-container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .25rem;
  height: 100%;
  max-width: 100%;
  padding: 0 .5rem env(safe-area-inset-bottom);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
}

.rv-mobile-nav-container::-webkit-scrollbar {
  display: none;
}

.rv-mobile-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  text-decoration: none;
  color: var(--p-color, #4a4a4a);
  transition: color 0.2s ease;
  min-width: 66px;
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.rv-mobile-nav-item i {
  font-size: 1.5rem;
  margin-bottom: 0.25rem;
}

.rv-mobile-nav-label {
  font-size: 0.625rem;
  font-weight: 500;
  text-align: center;
}

.rv-mobile-nav-item.active,
.rv-mobile-nav-item:hover {
  color: var(--primary-color, #E07A5F);
}

/* Show mobile nav on mobile devices */
@media (max-width: 991.98px) {
  .rv-mobile-nav {
    display: none !important;
  }
  
  /* Hide desktop sidebar on mobile + tablet */
  #miniSidebar {
    display: none !important;
  }
  
  /* Keep content/footer visible above fixed bottom nav */
  body {
    padding-bottom: 0 !important;
  }

  .min-vh-100 {
    padding-bottom: 0 !important;
  }

  .dash-main {
    margin-left: 0 !important;
    padding-bottom: 0 !important;
  }

  .dash-main > .container,
  .dash-main > .container-fluid,
  .dash-main > .container-xxl {
    padding-bottom: 0 !important;
  }

  footer {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* Dark mode adjustments for mobile nav */
body.dark-mode .rv-mobile-nav {
  background-color: #1e1e1e;
  border-top-color: #333;
}

body.dark-mode .rv-mobile-nav-item {
  color: #ddd;
}

body.dark-mode .rv-mobile-nav-item.active,
body.dark-mode .rv-mobile-nav-item:hover {
  color: var(--primary-color, #f39150);
}

/* ==========================================
   MOBILE HARDENING PACK (Priority Views)
   ========================================== */
.entry-media-thumb {
  width: 240px;
  max-width: 100%;
}

.entry-preview-image {
  width: 100%;
  max-width: 240px;
}

@media (max-width: 991.98px) {
  html,
  body {
    overflow-x: hidden;
  }

  .dash-main {
    overflow-x: clip;
  }

  .dash-main .container,
  .dash-main .container-xxl,
  .dash-main .container-fluid {
    min-width: 0;
    max-width: 100%;
  }

  .dash-main img,
  .dash-main video,
  .dash-main canvas,
  .dash-main iframe {
    max-width: 100%;
    height: auto;
  }

  .dash-main .nav-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .dash-main .nav-tabs::-webkit-scrollbar {
    display: none;
  }

  .dash-main .nav-tabs .nav-link {
    white-space: nowrap;
  }

  .gallery-header {
    align-items: flex-start !important;
    flex-direction: column;
    gap: 0.65rem;
  }

  .gallery-header-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .gallery-header-actions .input-group {
    width: 100%;
    min-width: 0;
  }

  .gallery-header-actions .btn {
    white-space: nowrap;
  }

  #finance-app .finance-header {
    align-items: flex-start !important;
    flex-direction: column;
    gap: 0.65rem;
  }

  #finance-app .finance-header-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  #finance-app .finance-header-actions > * {
    flex: 1 1 auto;
    min-width: 0;
  }

  #finance-app .finance-summary-toolbar {
    align-items: stretch !important;
  }

  #finance-app .finance-month-filter {
    width: 100% !important;
  }

  #finance-app #entryType {
    min-width: 0;
    margin-top: 0;
  }

  #finance-app .table-responsive {
    overflow-x: auto;
  }

  #finance-app .table-responsive table {
    min-width: 640px;
  }

  #finance-app .budget-head-actions {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: stretch;
    gap: 0.5rem !important;
  }

  #finance-app .budget-head-actions .btn {
    flex: 1 1 140px;
    min-width: 0;
    white-space: normal;
  }

  .profile-tabs .nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .profile-tabs .nav::-webkit-scrollbar {
    display: none;
  }

  .name-and-stats .stats .stat {
    min-width: 0;
  }

  .name-and-stats .stats .stat strong {
    word-break: break-word;
  }

  .entry-media-thumb {
    width: 100%;
    max-width: 100%;
  }

  .entry-preview-image {
    max-width: 100%;
  }

  .composer .row .col.d-flex {
    min-width: 0;
    flex-wrap: wrap;
  }

  .composer .row .col.d-flex .form-control {
    min-width: 0;
    width: 100%;
  }

  .composer .row .col.d-flex > .btn {
    flex: 1 1 auto;
  }
}

@media (max-width: 991.98px) {
  .rv-cal-actions {
    justify-content: flex-start;
  }

  .rv-cal-actions > * {
    flex: 0 0 auto;
  }

  .rv-cal-segmented {
    flex: 0 0 auto;
  }

  .rv-cal-scroll {
    overflow: auto;
    height: auto;
    max-height: min(78vh, 780px);
    min-height: 0;
  }

  #calendar .fc .fc-scrollgrid,
  #calendar .fc .fc-view-harness,
  #calendar .fc {
    min-width: 700px;
  }
}

@media (max-width: 575.98px) {
  .calendar-new-event-btn .bi {
    margin-right: 0 !important;
  }

  .rv-cal-scroll {
    height: auto;
    max-height: min(74vh, 700px);
  }
}