/* Base */
.bd-tp-wrap .bd-tp-note{ margin-left:10px; color:#64748b; font-size:13px; }
.bd-tp-toolbar{ display:flex; align-items:center; gap:10px; margin:12px 0; flex-wrap:wrap; }
.bd-tp-table td, .bd-tp-table th{ vertical-align:middle; }
.bd-tp-filters{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin:10px 0 14px; }
.bd-tp-filters label{ font-weight:600; font-size:13px; color:#334155; display:flex; flex-direction:column; gap:4px; }
.bd-tp-filters input{ min-width:180px; }

/* Frontend wrapper */
.bd-tp-frontend{ margin:8px 0 18px; }
.bd-tp-frontend__head{ display:flex; flex-direction:column; gap:4px; margin-bottom:10px; }
.bd-tp-frontend__title{ font-size:20px; font-weight:800; }
.bd-tp-frontend__note{ font-size:13px; color:#64748b; }

/* Frontend-Kalender: horizontales Scrollen (Desktop + Mobile) */
.bd-tp-calendar-scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

/* 12 Tage Gesamtbreite: ca. 7 Tage gleichzeitig sichtbar, Rest per horizontalem Scroll */
.bd-tp-calendar-scroll .fc{
  width: calc(100% * 12 / 7) !important;
}

/* Mobile: Mindestbreite an 12 Tage anpassen, damit Spalten lesbar bleiben */
@media (max-width: 768px){
  .bd-tp-calendar-scroll .fc{
    min-width: 1140px;
  }
}



/* FullCalendar: modern clean */
.fc{ --fc-border-color: #e5eaf2; --fc-page-bg-color:#fff; --fc-today-bg-color: rgba(59, 130, 246, .08); }
.fc .fc-scrollgrid{ border-radius:14px; overflow:hidden; border:1px solid #e5eaf2; }
.fc .fc-toolbar-title{ font-weight:800; }
.fc .fc-timegrid-slot-label, .fc .fc-col-header-cell-cushion{ color:#334155; font-weight:600; }
.fc .fc-timegrid-axis-cushion{ color:#64748b; }
.fc .fc-event{ border-radius:10px; padding:2px 6px; font-weight:700; }
/* Heute-Spalte: sehr dezent, damit Linien sichtbar bleiben */
.fc .fc-day-today{ background: rgba(59, 130, 246, .08) !important; }
/* Dezente Innenkontur statt stärkerer Fläche */
.fc .fc-timegrid-col.fc-day-today{
  box-shadow: inset 0 0 0 1px rgba(59, 130, 246, .10);
}

/* Modal */
.bd-tp-modal{ position:fixed; inset:0; z-index:100000; display:none; }
.bd-tp-modal.is-open{ display:block; }
.bd-tp-modal__backdrop{ position:absolute; inset:0; background:rgba(15,23,42,.45); }

.bd-tp-modal__dialog{
  position:relative;
  width: calc(100% - 40px);
  max-width: 980px;               /* vorher 520px -> zu schmal für Tabellen */
  margin: 7vh auto;
  background:#fff;
  border-radius:16px;
  border:1px solid #e5eaf2;
  box-shadow:0 20px 60px rgba(15,23,42,.25);
  overflow:hidden;                 /* Dialog bleibt „clean“, Scroll kommt in den Body */
}
@media (max-width: 560px){
  .bd-tp-modal__dialog{
    width: calc(100% - 20px);
    max-width: 520px;              /* auf sehr kleinen Screens wieder kompakter */
    margin: 5vh auto;
  }
}

.bd-tp-modal__header{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid #eef2f6; }
.bd-tp-modal__title{ font-weight:900; font-size:16px; color:#0f172a; }
.bd-tp-modal__x{ border:0; background:transparent; font-size:22px; line-height:1; cursor:pointer; color:#64748b; }

.bd-tp-modal__body{
  padding:14px 16px;
  max-height: calc(90vh - 120px);   /* Header+Footer abziehen -> Body wird scrollbar */
  overflow: auto;                   /* vertikal + horizontal */
  -webkit-overflow-scrolling: touch;
}

.bd-tp-modal__footer{ padding:12px 16px; border-top:1px solid #eef2f6; display:flex; gap:10px; flex-wrap:wrap; }

/* ===== Tarif-Historie im Modal: Scroll + Mindestbreite ===== */
.bd-tp-modal__body details{
  overflow-x: auto;                 /* horizontales Scrollen im History-Block */
  -webkit-overflow-scrolling: touch;
}

.bd-tp-modal__body details table{
  min-width: 920px;                 /* verhindert, dass Spalten unlesbar schmal werden */
}

.bd-tp-modal__body details th,
.bd-tp-modal__body details td{
  white-space: nowrap;              /* verhindert Umbruch/Chaos in Tabellenzellen */
}

/* Eingabefelder in der Tabelle: Mindestbreiten, damit sie nutzbar bleiben */
.bd-tp-modal__body details input[type="datetime-local"]{
  min-width: 190px;
}
.bd-tp-modal__body details input[type="number"]{
  min-width: 120px;
}
.bd-tp-modal__body details select{
  min-width: 90px;
}

/* Form */
.bd-tp-form label{ display:block; font-weight:700; color:#334155; margin:10px 0 6px; }
.bd-tp-form input[type="text"], .bd-tp-form input[type="number"], .bd-tp-form input[type="datetime-local"], .bd-tp-form select{
  width:100%; max-width:100%;
  padding:9px 10px; border-radius:12px;
  border:1px solid #e2e8f0; background:#fff;
}
.bd-tp-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width: 900px){
  .bd-tp-grid2{ grid-template-columns:1fr; }
}
.bd-tp-inline{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.bd-tp-chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background:#f1f5f9; color:#0f172a; font-weight:800; font-size:12px; }
.bd-tp-note-small{ margin-top:10px; color:#64748b; font-size:12px; line-height:1.4; }
.bd-tp-kv{ display:grid; grid-template-columns:160px 1fr; gap:10px; padding:6px 0; border-bottom:1px dashed #eef2f6; }
.bd-tp-kv > div:first-child{ color:#64748b; font-weight:700; }

/* Segmented control (z.B. Währung HUF/EUR) */
.bd-tp-seg{
  display:flex;
  border:1px solid #e2e8f0;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
.bd-tp-seg__item{
  flex:1;
  margin:0;
  cursor:pointer;
}
.bd-tp-seg__item input{
  display:none;
}
.bd-tp-seg__item span{
  display:block;
  padding:8px 10px;
  text-align:center;
  font-weight:800;
  background:#f8fafc;
  color:#334155;
}
.bd-tp-seg__item + .bd-tp-seg__item span{
  border-left:1px solid #e2e8f0;
}
.bd-tp-seg__item input:checked + span{
  background:#0f172a;
  color:#fff;
}

/* Toast */
.bd-tp-toast{
  position:fixed; right:18px; bottom:18px; z-index:100001;
  background:#0f172a; color:#fff; padding:10px 12px; border-radius:12px;
  box-shadow:0 12px 40px rgba(15,23,42,.28);
  transform: translateY(16px); opacity:0; transition: all .22s ease;
  font-weight:700; font-size:13px; max-width:360px;
}
.bd-tp-toast.is-on{ transform: translateY(0); opacity:1; }
.bd-tp-toast--error{ background:#b91c1c; }
.bd-tp-toast--ok{ background:#0f172a; }


/* Event-Inhalt: sauberer Abstand, nichts klebt am Rand */
.bd-tp-frontend .fc .fc-timegrid-event .fc-event-main{
  padding: 1px 10px !important;   /* innen Luft */
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 6px !important;
}

/* Titel nicht „nach unten drücken“ */
.bd-tp-frontend .fc .fc-timegrid-event .fc-event-title{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.25 !important;
}

/* Zeitzeile etwas kompakter */
.bd-tp-frontend .fc .fc-timegrid-event .fc-event-time{
  line-height: 1.2 !important;
}


/* ===== Backend/Frontend Kalender: hellere Flächen, bessere Lesbarkeit (ohne Zeitachse zu beeinflussen) ===== */

/* 1) Grid-Linien etwas klarer (aber nicht dunkel) */
.fc{
  --fc-border-color: #e8eef6;              /* etwas heller als aktuell */
  --fc-neutral-bg-color: #ffffff;          /* neutrale Flächen hell */
  --fc-page-bg-color: #ffffff;
}

/* 2) Header und Zeitachse: sehr hell, damit Linien sichtbar bleiben */
.fc .fc-col-header,
.fc .fc-col-header-cell,
.fc .fc-timegrid-axis,
.fc .fc-timegrid-axis-frame,
.fc .fc-timegrid-axis-cushion,
.fc .fc-timegrid-slot-label,
.fc .fc-timegrid-slot-label-frame{
  background: #fbfdff;                     /* sehr helles Blauweiß */
}

/* 3) Der eigentliche Kalenderkörper bleibt weiß */
.fc .fc-scrollgrid,
.fc .fc-scrollgrid-section-body,
.fc .fc-timegrid-body,
.fc .fc-timegrid-slots,
.fc .fc-timegrid-cols{
  background: #ffffff;
}

/* 4) Texte etwas kontrastreicher (bessere Lesbarkeit, ohne „schwer“ zu wirken) */
.fc .fc-col-header-cell-cushion{
  color:#1f2937;                            /* dunkler als #334155 */
  font-weight:700;
  white-space: normal;
  text-align: center;
}

/* Zweizeiliger Tageskopf im Header */
.fc .fc-col-header-cell-cushion .bd-tp-dayhdr{
  display:flex;
  flex-direction:column;
  align-items:center;
  line-height:1.15;
}

.fc .fc-col-header-cell-cushion .bd-tp-dayhdr__dow{
  font-weight:800; /* "Montag" bold */
}

.fc .fc-col-header-cell-cushion .bd-tp-dayhdr__date{
  font-weight:400; /* Datum regular */
  font-size:12px;
  color:#475569;
}

.fc .fc-timegrid-axis-cushion,
.fc .fc-timegrid-slot-label-cushion{
  color:#6b7280;                            /* dezent, aber lesbar */
  font-weight:600;
}

/* 5) Sehr dezente horizontale Slot-Linien (optional) */
.fc .fc-timegrid-slot{
  border-color: var(--fc-border-color);
}

/* ===== Zebra-Spalten (volle Höhe) + Heute NICHT hervorheben ===== */

/* 0) Heute komplett neutralisieren (du hast oben noch bg + box-shadow) */
.fc{
  --fc-today-bg-color: transparent !important;
}
.fc .fc-day-today{
  background: transparent !important;
}
.fc .fc-timegrid-col.fc-day-today{
  box-shadow: none !important;
}

/* 1) Zebra im Header (Wochentage) */
.fc .fc-col-header-cell:nth-child(even){
  background: #f9fbfe !important;
}

/* 2) Zebra im Grid-Hintergrund-Layer (wirkt bis ganz unten, auch wenn keine Events da sind) */
.fc .fc-timegrid-col-bg .fc-timegrid-col:nth-child(even){
  background: #f9fbfe !important;
}

/* 3) Zebra im Grid-Content-Layer (falls der Hintergrund-Layer von Theme/Browser überdeckt wird) */
.fc .fc-timegrid-cols .fc-timegrid-col:nth-child(even){
  background: #f9fbfe !important;
}
/* Userbooking: Greeting */
.bd-tp-userbooking #bd-tp-user-greeting{
  font-weight: 800;
}

/* Login-Modal soll nicht schließbar sein */
.bd-tp-modal.is-lock [data-bd-tp-close]{
  pointer-events: none;
}
.bd-tp-modal.is-lock .bd-tp-modal__x{
  display: none !important;
}

/* Adminbuchung: User-Dropdown-Bar */
.bd-tp-adminbooking__bar{
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
  margin: 10px 0 12px;
}
.bd-tp-adminbooking__label{
  font-weight:700;
  color:#334155;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.bd-tp-adminbooking__select{
  min-width: 260px;
}
.bd-tp-adminbooking__meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}


/* Adminbuchung (Frontend): Slot-Höhe reduzieren – scoped auf #bd-tp-adminbooking-calendar */
.bd-tp-adminbooking #bd-tp-adminbooking-calendar .fc{
  --fc-timegrid-slot-min-height: 12px;  /* halb so hoch: ggf. 10px/14px feinjustieren */
}

/* Fallback (falls die Variable in deiner FC-Version nicht greift) */
.bd-tp-adminbooking #bd-tp-adminbooking-calendar .fc .fc-timegrid-slot,
.bd-tp-adminbooking #bd-tp-adminbooking-calendar .fc .fc-timegrid-slot-lane{
  height: 12px !important;
}

/* ===== 30-Minuten-Freislots: kompakt (Zeit sichtbar), ohne Titel "Frei" ===== */
.fc .bdtp-free-30 .fc-event-main{
  padding: 2px 4px !important;
  gap: 2px !important;
}
.fc .bdtp-free-30 .fc-event-time{
  font-size: 11px !important;
  line-height: 1.1 !important;
}
.fc .bdtp-free-30 .fc-event-title{
  display: none !important;
}


@media (max-width: 768px){
  .bd-tp-frontend .fc .fc-timegrid-event .fc-event-time{ font-size: 8px !important; }
  .bd-tp-frontend .fc .fc-timegrid-event .fc-event-title{ font-size: 11px !important; }
}

/* ===== Statistik ===== */
.bd-tp-stats-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  margin-top:14px;
}
@media (max-width: 1100px){
  .bd-tp-stats-grid{ grid-template-columns: 1fr; }
}
.bd-tp-stats-card{
  background:#fff;
  border:1px solid #e5eaf2;
  border-radius:14px;
  padding:14px;
}
.bd-tp-stats-card h2{ margin-top:0; }
.bd-tp-stats-card--full{ grid-column: 1 / -1; }
.bd-tp-stats-chartwrap{
  position:relative;
  height:340px;
}
.bd-tp-stats-table td, .bd-tp-stats-table th{ vertical-align:top; }

/* ===== Nutzerverwaltung: Tarif-Historie ===== */
.bd-tp-details{
  margin-top: 12px;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  padding: 10px 12px;
  background: #f8fafc;
}
.bd-tp-details > summary{
  cursor: pointer;
  font-weight: 700;
}
.bd-tp-details[open] > summary{
  margin-bottom: 10px;
}
.bd-tp-mini-table input[type="datetime-local"],
.bd-tp-mini-table input[type="number"],
.bd-tp-mini-table select{
  width: 100%;
  box-sizing: border-box;
}
.bd-tp-ph-actions{
  text-align: right;
  white-space: nowrap;
}

/* ===== Statistik: Userranking ===== */
.bd-tp-rank-form{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 8px 0 14px;
}