html {
  font-size: 14px;
}

/* Light/default theme background = Profi Cream */
html:not([data-theme]), html[data-theme="light"]{ background:#F6F4EA; }

@media (min-width: 768px) {
  html { font-size: 16px; }
}

/* ===================== Typography ===================== */
/* Optional local licensed primary font: Ranch Water */
/* Place ranch-water.woff2/woff in wwwroot/fonts/ and uncomment font-family stack to activate */
@font-face{
  font-family: 'Ranch Water';
  src: url('/fonts/ranch-water.woff2') format('woff2'),
       url('/fonts/ranch-water.woff') format('woff');
  font-display: swap;
  font-weight: 400 800;
  font-style: normal;
  unicode-range: U+000-5FF, U+1E00-1EFF, U+2000-206F, U+20AC, U+00A9, U+00AE;
}

:root{
  /* Body and brand font stacks with safe fallbacks */
  --font-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --font-brand: "Ranch Water", "Baloo 2", "Comic Sans MS", "Trebuchet MS", system-ui, sans-serif;
}

body{ margin-bottom: 60px; font-family: var(--font-body); color: #1d2430; }

h1, h2, h3, h4, h5, h6, .brand-title{ font-family: var(--font-brand); letter-spacing: .2px; }
/* Slightly heavier headings for brand impact */
.h1, h1{ font-weight: 700; }
.h2, h2{ font-weight: 700; }
.h3, h3{ font-weight: 600; }

/* Focus ring tuned to Passion Red */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem rgba(255,255,255,.9), 0 0 0 0.25rem rgba(88,1,2,.35);
  border-color: rgba(88,1,2,.6);
}

html { position: relative; min-height: 100%; }

/* Brand palette */
:root { 
  /* Passion Red */
  --brand: #580102; 
  --brand-600: #760203; /* hover */
  /* Accent palette */
  --blurple: #CCD2FF;   /* Mutig Blurple */
  --deep-blue: #647AFF; /* Deep Blue */
  --joy-yellow: #FFB43B;/* Joyful Yellow */
  --cream: #F6F4EA;     /* Profi Cream */
}

/* Bootstrap 5 color variables override (light theme) */
:root, [data-theme="light"]{
  --bs-primary: #580102;
  --bs-primary-rgb: 88, 1, 2;
  --bs-link-color: #580102;
  --bs-link-hover-color: #760203;
  --bs-body-bg: #F6F4EA;
}

/* Clean Profi Cream background for auth pages */
.auth-body { background: #F6F4EA; }

.auth-body .card { border: none; border-radius: 16px; box-shadow: 0 10px 30px rgba(13,110,253,.08), 0 2px 10px rgba(0,0,0,.04); }
.auth-body .card .card-body { padding: 2rem !important; }
.auth-body h3 { font-weight: 700; letter-spacing: -0.01em; }
.auth-body .text-muted { color: #6c757d !important; }

/* Brand Header: transparent (no bottom line) in all themes */
.brand-header { background: transparent !important; border-bottom: 0 !important; }
.brand-header .brand-logo {
  height: 40px;
  width: auto;
  display: block;
}

/* Keep dashboard-specific larger logo separate */
.dashboard-logo{ height:56px; width:auto; opacity:.95; filter: drop-shadow(0 6px 18px rgba(0,0,0,.08)); }

/* ===================== Button theming (palette-driven) ===================== */
/* Primary = Passion Red */
.btn-primary{
  --bs-btn-color:#fff;
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg: var(--brand-600);
  --bs-btn-hover-border-color: var(--brand-600);
  --bs-btn-focus-shadow-rgb: 88,1,2;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:#3e0001;
  --bs-btn-active-border-color:#3e0001;
  --bs-btn-disabled-bg: var(--brand);
  --bs-btn-disabled-border-color: var(--brand);
}

/* Secondary = Deep Blue */
.btn-secondary{
  --bs-btn-color:#fff;
  --bs-btn-bg: var(--deep-blue);
  --bs-btn-border-color: var(--deep-blue);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:#5167db; /* darker deep blue */
  --bs-btn-hover-border-color:#5167db;
  --bs-btn-focus-shadow-rgb: 100,122,255;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:#4154b6;
  --bs-btn-active-border-color:#4154b6;
  --bs-btn-disabled-bg: var(--deep-blue);
  --bs-btn-disabled-border-color: var(--deep-blue);
}

/* Info = Mutig Blurple */
.btn-info{
  --bs-btn-color:#1d2430;
  --bs-btn-bg: var(--blurple);
  --bs-btn-border-color: var(--blurple);
  --bs-btn-hover-color:#1d2430;
  --bs-btn-hover-bg:#b7c3ff;
  --bs-btn-hover-border-color:#b7c3ff;
  --bs-btn-focus-shadow-rgb: 204,210,255;
  --bs-btn-active-color:#1d2430;
  --bs-btn-active-bg:#a9b8ff;
  --bs-btn-active-border-color:#a9b8ff;
  --bs-btn-disabled-bg: var(--blurple);
  --bs-btn-disabled-border-color: var(--blurple);
}

/* Warning = Joyful Yellow (CTA accent) */
.btn-warning{
  --bs-btn-color:#1d2430;
  --bs-btn-bg: var(--joy-yellow);
  --bs-btn-border-color: var(--joy-yellow);
  --bs-btn-hover-color:#1d2430;
  --bs-btn-hover-bg:#ffa11a;
  --bs-btn-hover-border-color:#ffa11a;
  --bs-btn-focus-shadow-rgb: 255,180,59;
  --bs-btn-active-color:#1d2430;
  --bs-btn-active-bg:#ff9703;
  --bs-btn-active-border-color:#ff9703;
  --bs-btn-disabled-bg: var(--joy-yellow);
  --bs-btn-disabled-border-color: var(--joy-yellow);
}

/* Outline variants aligned to palette */
.btn-outline-primary{
  --bs-btn-color: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg: var(--brand);
  --bs-btn-hover-border-color: var(--brand);
  --bs-btn-focus-shadow-rgb: 88,1,2;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg: var(--brand-600);
  --bs-btn-active-border-color: var(--brand-600);
}
.btn-outline-secondary{
  --bs-btn-color: var(--deep-blue);
  --bs-btn-border-color: var(--deep-blue);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg: var(--deep-blue);
  --bs-btn-hover-border-color: var(--deep-blue);
  --bs-btn-focus-shadow-rgb: 100,122,255;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:#5167db;
  --bs-btn-active-border-color:#5167db;
}
.btn-outline-info{
  --bs-btn-color: #1d2430;
  --bs-btn-border-color: var(--blurple);
  --bs-btn-hover-color:#1d2430;
  --bs-btn-hover-bg: var(--blurple);
  --bs-btn-hover-border-color: var(--blurple);
  --bs-btn-focus-shadow-rgb: 204,210,255;
  --bs-btn-active-color:#1d2430;
  --bs-btn-active-bg:#b7c3ff;
  --bs-btn-active-border-color:#b7c3ff;
}
.btn-outline-warning{
  --bs-btn-color: #8a5700;
  --bs-btn-border-color: var(--joy-yellow);
  --bs-btn-hover-color:#1d2430;
  --bs-btn-hover-bg: var(--joy-yellow);
  --bs-btn-hover-border-color: var(--joy-yellow);
  --bs-btn-focus-shadow-rgb: 255,180,59;
  --bs-btn-active-color:#1d2430;
  --bs-btn-active-bg:#ffa11a;
  --bs-btn-active-border-color:#ffa11a;
}

/* ===================== Dark Mode ===================== */
.theme-toggle { position: fixed; top: 12px; right: 12px; z-index: 1030; }
:root, [data-theme="light"] { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }
[data-theme="dark"] body { background-color: #0f1115; color: #e5e7eb; }
[data-theme="dark"] a { color: #8ab4f8; }
[data-theme="dark"] a:hover { color: #a8c7fa; }
[data-theme="dark"] .card, [data-theme="dark"] .modal-content, [data-theme="dark"] .dropdown-menu, [data-theme="dark"] .list-group-item, [data-theme="dark"] .offcanvas, [data-theme="dark"] .accordion-item { background-color: #171a21; color: #e5e7eb; border-color: #2a2f3a; }
[data-theme="dark"] .accordion-button { background-color: #171a21; color: #e5e7eb; }
[data-theme="dark"] .accordion-button:not(.collapsed) { color: #e5e7eb; background-color: #1b1f27; }
[data-theme="dark"] .table { --bs-table-bg: #12151b; --bs-table-striped-bg: #151922; --bs-table-striped-color: #e5e7eb; --bs-table-hover-bg: #19202b; --bs-table-hover-color: #e5e7eb; color: #e5e7eb; border-color: #2a2f3a; }
[data-theme="dark"] .form-control, [data-theme="dark"] .form-select, [data-theme="dark"] .form-check-input, [data-theme="dark"] .input-group-text, [data-theme="dark"] .form-control:disabled, [data-theme="dark"] .form-select:disabled { background-color: #0f131a; color: #e5e7eb; border-color: #2a2f3a; }
[data-theme="dark"] .form-control::placeholder { color: #a3a3a3; }
[data-theme="dark"] .form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
[data-theme="dark"] .form-control:focus, [data-theme="dark"] .form-select:focus { border-color: #4f8cff; box-shadow: 0 0 0 .25rem rgba(79,140,255,.25); }
[data-theme="dark"] .border-top { border-top-color: #2a2f3a !important; }
[data-theme="dark"] .border-bottom { border-bottom-color: #2a2f3a !important; }
[data-theme="dark"] .alert { border-color: #2a2f3a; }
[data-theme="dark"] .btn-outline-secondary { color: #e5e7eb; border-color: #8a8f98; }
[data-theme="dark"] .btn-outline-secondary:hover { background: #2a2f3a; }
/* Hero logo on auth pages (responsive, constrained) */
.auth-body .auth-hero-logo {
  display: block;
  width: 100%;
  height: auto;
  max-width: 440px;
  margin: 0 auto 1rem;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.08));
}

/* ===================== Mobile tweaks ===================== */
/* General touch targets */
.btn, .btn-sm{ min-height: 44px; }
.form-control, .form-select{ min-height: 44px; }

/* Dashboard tiles look */
.dashboard .tile-card{ border:0; border-radius:14px; background:#fff; box-shadow: 0 6px 20px rgba(0,0,0,.06), 0 1px 4px rgba(0,0,0,.04); }
.dashboard .tile-card .card-body{ padding: 1rem 1rem; }
.dashboard .icon-badge{ font-size: 1.25rem; }

@media (max-width: 576px){
  /* Typography scale */
  .dashboard h2{ font-size: 1.55rem; }
  .dashboard h5{ font-size: 1.1rem; }
  .dashboard p.text-muted{ font-size: .95rem; }

  /* Tile adjustments */
  .dashboard .card .card-body{ padding: 1rem; }
  .dashboard .tile-card .btn{ width: 100%; padding: .85rem 1rem; font-size: 1.05rem; border-radius: 10px; }
  .dashboard .tile-card .mt-auto{ margin-top: .75rem !important; }
  .dashboard .row > .col-12.col-md-6:first-child{ margin-bottom: .5rem; }

  /* Logo placement */
  img#hdrLogo{ max-height: 96px; width: auto; display:block; margin: 0 auto .25rem; }

  /* Dialogs and lists */
  .modal-dialog{ margin: 0.5rem; }
  .list-group-item{ padding: .875rem 1rem; }
  .accordion-button{ padding: .875rem 1rem; font-size: 1.05rem; }
}

/* Bottom navigation (mobile) */
.bottom-nav{ position: fixed; z-index: 1030; left:0; right:0; bottom:0; background: #F6F4EA; border-top:1px solid rgba(88,1,2,.2); display:flex; height: 62px; }
.bottom-nav .bn-item{ flex:1; align-items:center; justify-content:center; display:flex; flex-direction:column; text-decoration:none; color:#442; font-size:.8rem; }
.bottom-nav .bn-item .bn-ic{ line-height:1; font-size:1.2rem; }
.bottom-nav .bn-item i{ font-size:1.25rem; line-height:1; }
/* Compact FullCalendar toolbar on very small devices */
@media (max-width: 420px){
  .fc .fc-toolbar.fc-header-toolbar{ flex-wrap: wrap; gap: .25rem; }
  .fc .fc-toolbar-title{ font-size: 1rem; }
  .fc .fc-button{ padding: .25rem .4rem; font-size: .8rem; }
}

/* Push page content above bottom bar */
@media (max-width: 576px){
  main[role="main"].dashboard{ padding-bottom: 90px !important; }
}

/* Calendar RoomBar */
.calendar-roombar{ background:#fff; border-radius:12px; box-shadow: 0 6px 20px rgba(0,0,0,.06), 0 1px 4px rgba(0,0,0,.04); padding: 1rem; }
.calendar-roombar .form-label{ font-weight:600; }
@media (max-width: 576px){
  .calendar-roombar{ padding: .75rem .9rem; }
  .calendar-roombar .form-select{ min-height: 44px; font-size: 1.05rem; }
  #legend{ gap: .75rem !important; }
}

/* FullCalendar mobile polish */
.fc .fc-toolbar.fc-header-toolbar{ margin-bottom: .5rem; }
@media (max-width: 576px){
  .fc .fc-toolbar-title{ font-size: 1.1rem; }
  .fc .fc-button{ padding:.35rem .55rem; border-radius:10px; }
  .fc .fc-button-group{ gap:.25rem; }
  .fc .fc-timegrid-slot{ height: 2.25rem; }
  .fc .fc-scrollgrid{ border-radius: 12px; overflow:hidden; }
}

/* Eigene Buchungen hervorheben */
.fc .own-booking, .fc .own-booking a{ outline: 2px solid #d4af37 !important; box-shadow: 0 0 0 3px rgba(212,175,55,.25) inset; }
.fc .own-booking { border-radius: 6px; }
/* mobile-friendly button spacing tweaks */
@media (max-width: 576px) {
  .btn-mobile-tight {
    padding-top: .35rem;
    padding-bottom: .35rem;
    line-height: 1.1;
  }
  .fc .fc-toolbar-chunk > .btn, .fc .fc-button {
    padding-top: .35rem !important;
    padding-bottom: .35rem !important;
    line-height: 1.1 !important;
  }
}

/* Back button polish: smaller and aligned */
.btn-back{ display:inline-flex; align-items:center; gap:.3rem; padding:.3rem .6rem; line-height:1.1; border-radius:10px; min-height: 32px; height:auto; white-space: nowrap; }
@media (max-width:576px){ .btn-back{ padding:.28rem .55rem; font-size:.95rem; min-height: 30px; } }
/* override global min-height for this button */
.btn.btn-back{ min-height: 30px !important; }

/* ===================== FullCalendar event text overflow fix ===================== */
/* Prevent event text from spilling into neighbouring events */
.fc .fc-event, .fc .fc-timegrid-event, .fc .fc-event-main, .fc .fc-event-title { overflow: hidden; }
.fc .fc-event-title, .fc .fc-event-time { text-overflow: ellipsis; white-space: nowrap; }
/* Our custom content wrapper */
.fcx-wrap{ overflow: hidden; }
.fcx-title, .fcx-note{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* On small screens: show text but truncate to one line */
@media (max-width: 576px){
  .fc .fc-timegrid-event .fcx-title, .fc .fc-timegrid-event .fcx-note{
    display:block !important;
    font-size:.78rem;
    line-height:1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .fc .fc-timegrid-event .fcx-time{ font-weight:600; }
}
