/* CoachElite Platform – Frontend App UI (ohne externe Frameworks)
   CoachElite by BHB Marketing */

:root{
  --ce-primary: #0B5FFF;
  --ce-bg: #F8FAFC;
  --ce-text: #0B1220;
  --ce-border: rgba(2,6,23,.10);
  --ce-shadow: 0 12px 30px rgba(2,6,23,.10);
  --ce-radius: 18px;
  --ce-radius-sm: 14px;
  --ce-space-16: 16px;
  --ce-space-24: 24px;
}

/* Layout Safety */
.ce-app, .ce-app * , .ce-login-shell, .ce-login-shell *{box-sizing:border-box;}
.ce-app *{min-width:0;}
.ce-app-content{overflow-wrap:anywhere;}

/* Base UI */
.ce-muted{color:rgba(2,6,23,.65);}
.ce-card{
  background:#fff;
  border:1px solid var(--ce-border);
  border-radius:var(--ce-radius);
  padding:var(--ce-space-16);
  box-shadow:0 10px 24px rgba(2,6,23,.06);
  transition:transform .12s ease, box-shadow .12s ease;
}

/* Konsistentes Card-System */
.ce-card__header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:-2px 0 12px 0;}
.ce-card__header--split{justify-content:space-between;}
.ce-card__body{display:block;}

/* Headings */
.ce-h2{margin:0;font-size:1.1rem;letter-spacing:-.01em;}
.ce-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media (max-width:980px){.ce-grid-3{grid-template-columns:1fr;}}

.ce-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.05rem;border-radius:999px;
  border:1px solid var(--ce-border);
  text-decoration:none;font-weight:700;cursor:pointer;
  background:#fff;color:inherit;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.ce-btn:hover{transform:translateY(-1px);box-shadow:var(--ce-shadow);}
.ce-btn:active{transform:translateY(0);}
.ce-btn-primary{background:var(--ce-primary);border-color:transparent;color:#fff;}
.ce-btn-primary:hover{filter:brightness(.92);}
.ce-btn-success{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.28);color:#065F46;}
.ce-btn-success:hover{background:rgba(16,185,129,.16);}

.ce-input{width:100%;padding:.8rem .9rem;border:1px solid var(--ce-border);border-radius:var(--ce-radius-sm);background:#fff;}
.ce-form{display:grid;gap:10px;}
.ce-list{margin:.6rem 0 0;padding-left:18px;}

/* Responsive Tables */
.ce-table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.ce-table{width:100%;border-collapse:collapse;}
.ce-table th,.ce-table td{border-bottom:1px solid rgba(2,6,23,.08);padding:.55rem .45rem;text-align:left;font-size:.95rem;vertical-align:top;}
.ce-table th{font-weight:800;white-space:nowrap;}
@media (max-width: 700px){
  .ce-table{min-width:560px;}
}

.ce-alert{border-radius:16px;padding:12px 14px;border:1px solid var(--ce-border);background:#fff;}
.ce-alert-error{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.06);}
.ce-alert-success{border-color:rgba(16,185,129,.28);background:rgba(16,185,129,.08);}
.ce-alert-warning{border-color:rgba(234,179,8,.35);background:rgba(234,179,8,.08);}

.ce-badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;border:1px solid var(--ce-border);font-size:.82rem;color:rgba(2,6,23,.65);}
.ce-badge-warn{border-color:rgba(234,179,8,.35);background:rgba(234,179,8,.08);color:#7C5C00;}
.ce-badge-success{border-color:rgba(16,185,129,.28);background:rgba(16,185,129,.10);color:#065F46;}

/* Notes (Client Profile) – Mobile friendly actions */
.ce-note-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.ce-note-actions-toggle{display:none;}
.ce-note-actions-menu{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
@media (max-width: 680px){
  .ce-note-actions-toggle{display:inline-flex;}
  .ce-note-actions-menu{display:none;width:100%;padding-top:8px;}
  .ce-note-actions-menu.is-open{display:flex;}
}

/* Login */
.ce-login-shell{min-height:70vh;display:grid;place-items:center;padding:24px;}
.ce-login-card{max-width:520px;width:100%;}
.ce-login-brand{font-weight:900;font-size:1.15rem;letter-spacing:-.02em;display:flex;gap:10px;align-items:baseline;}
.ce-login-brand span{font-weight:700;font-size:.85rem;color:rgba(2,6,23,.60);}

/* App Shell */
.ce-app{
  width:100%;
  max-width: 1480px;
  margin: 0 auto;
  display:grid;
  grid-template-columns: 270px minmax(0, 1fr);
  grid-template-areas: "sidebar main";
  min-height: 75vh;
  border:1px solid var(--ce-border);
  border-radius:var(--ce-radius);
  overflow:hidden;
  background:#fff;
  box-shadow:0 10px 24px rgba(2,6,23,.06);
}
@media (max-width: 980px){
  .ce-app{grid-template-columns:1fr;grid-template-areas:"sidebar" "main";}
}

.ce-app-sidebar{
  grid-area: sidebar;
  background:rgba(2,6,23,.02);
  border-right:1px solid var(--ce-border);
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
@media (max-width: 980px){
  .ce-app-sidebar{border-right:none;border-bottom:1px solid var(--ce-border);}
}

.ce-app-brand{font-weight:900;font-size:1.05rem;display:flex;gap:10px;align-items:baseline;}
.ce-app-brand span{font-weight:700;font-size:.82rem;color:rgba(2,6,23,.60);}

.ce-app-user{padding:12px;border:1px solid var(--ce-border);border-radius:16px;background:#fff;}
.ce-app-user-name{font-weight:900;}
.ce-app-user-meta{margin-top:6px;font-size:.92rem;}

.ce-app-nav{display:grid;gap:6px;margin-top:2px;}
.ce-app-nav-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:14px;
  text-decoration:none;color:inherit;
  border:1px solid transparent;
}
.ce-app-nav-item:hover{background:rgba(2,6,23,.06);}
.ce-app-nav-item.is-active{background:#fff;border-color:rgba(11,95,255,.25);box-shadow:0 8px 18px rgba(11,95,255,.10);}
.ce-app-nav-item.is-locked{opacity:.75;}
.ce-app-nav-ico{width:20px;text-align:center;}
.ce-app-nav-lock{margin-left:auto;}

.ce-app-sidebar-footer{margin-top:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.ce-app-link{text-decoration:none;font-weight:800;color:inherit;}
.ce-app-link:hover{text-decoration:underline;}

.ce-app-main{
  grid-area: main;
  min-width: 0; /* wichtig: verhindert "schmale" Spalten bei Grid-Children */
  padding:var(--ce-space-24);
  background:var(--ce-bg);
}
.ce-app-header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.ce-app-title{margin:0;font-size:1.45rem;letter-spacing:-.02em;}

.ce-app-content{
  display:flex;
  flex-direction:column;
  gap:var(--ce-space-16);
}

/* 12er Grid für saubere Dashboard-Layouts */
.ce-grid-12{display:grid;grid-template-columns:repeat(12, minmax(0,1fr));gap:12px;align-items:start;}
.ce-grid-12 .ce-span-12{grid-column:span 12;}
.ce-grid-12 .ce-span-8{grid-column:span 8;}
.ce-grid-12 .ce-span-6{grid-column:span 6;}
.ce-grid-12 .ce-span-4{grid-column:span 4;}
.ce-grid-12 .ce-span-3{grid-column:span 3;}

@media (max-width: 1100px){
  .ce-grid-12{grid-template-columns:repeat(6, minmax(0,1fr));}
  .ce-grid-12 .ce-span-12{grid-column:span 6;}
  .ce-grid-12 .ce-span-8{grid-column:span 6;}
  .ce-grid-12 .ce-span-6{grid-column:span 6;}
  .ce-grid-12 .ce-span-4{grid-column:span 3;}
  .ce-grid-12 .ce-span-3{grid-column:span 3;}
}
@media (max-width: 720px){
  .ce-grid-12{grid-template-columns:1fr;}
  .ce-grid-12 > *{grid-column:1 / -1 !important;}
}

/* Dashboard KPI Grid (kompakt, gleiche Höhe) */
.ce-kpi-grid{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:12px;}
@media (max-width: 980px){.ce-kpi-grid{grid-template-columns:1fr;}}
.ce-kpi-card{padding:14px;border-radius:16px;display:flex;flex-direction:column;justify-content:space-between;min-height:92px;box-shadow:none;}
.ce-kpi-title{font-weight:800;}
.ce-kpi-value{margin-top:10px;font-weight:900;font-size:1.35rem;letter-spacing:-.02em;}
.ce-kpi-sub{font-weight:800;font-size:.95rem;color:rgba(2,6,23,.55);}

/* Inputs/Selects: mobile-stabil */
input, select, textarea{max-width:100%;}
select{min-width:0;}

/* Split-Layout für Tabs (links Aktionen, rechts Liste) */
.ce-split{display:grid;grid-template-columns:360px minmax(0, 1fr);gap:12px;align-items:start;}
@media (max-width: 980px){.ce-split{grid-template-columns:1fr;}}

/* Allgemeines Page-Grid (z.B. Sessions: Form links, Liste rechts) */
.ce-page-grid{display:grid;grid-template-columns:420px minmax(0, 1fr);gap:12px;align-items:start;}
@media (max-width: 1100px){.ce-page-grid{grid-template-columns:1fr;}}

/* Dashboard – Workspace Cards */
.ce-workspace-grid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:12px;}
@media (max-width: 1100px){.ce-workspace-grid{grid-template-columns:repeat(2, minmax(0,1fr));}}
@media (max-width: 680px){.ce-workspace-grid{grid-template-columns:1fr;}}

.ce-workspace-card{display:block;text-decoration:none;color:inherit;}
.ce-workspace-card:hover .ce-card{transform:translateY(-1px);box-shadow:var(--ce-shadow);}
.ce-workspace-top{display:flex;gap:10px;align-items:flex-start;}
.ce-workspace-ico{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(11,95,255,.08);border:1px solid rgba(11,95,255,.18);font-size:18px;flex:0 0 auto;}
.ce-workspace-title{margin:0;font-size:1.05rem;letter-spacing:-.01em;}
.ce-workspace-desc{margin:4px 0 0 0;color:rgba(2,6,23,.65);}

.ce-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:2px 0 6px;}
.ce-section-head h2,.ce-section-head h3{margin:0;}

/* Mobile: Navigation als horizontale Leiste (weniger "Scroll-Overload") */
@media (max-width: 680px){
  .ce-app-sidebar{padding:12px;gap:10px;}
  .ce-app-user{display:none;}
  .ce-app-nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;}
  .ce-app-nav-item{flex:0 0 auto;white-space:nowrap;padding:9px 10px;}
  .ce-app-sidebar-footer{margin-top:0;}
}

/* Locked Card */
.ce-locked{position:relative;}
.ce-locked-badge{
  position:absolute;top:12px;right:12px;
  padding:.2rem .55rem;border-radius:999px;
  background:rgba(2,6,23,.06);
  border:1px dashed var(--ce-border);
  font-weight:800;font-size:.85rem;
}

/* Pipelines/Sessions helpers */
.ce-form-row{display:grid;gap:10px;margin:10px 0;grid-template-columns:repeat(3, minmax(0,1fr));}
.ce-form-row-2{grid-template-columns:repeat(2, minmax(0,1fr));}
.ce-form-row-3{grid-template-columns:repeat(3, minmax(0,1fr));}
@media (max-width:1100px){.ce-form-row,.ce-form-row-2,.ce-form-row-3{grid-template-columns:1fr;}}
.ce-form-row .ce-input{width:100%;}

/* Form Grid (Textareas/Inputs) */
.ce-form-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px;margin:10px 0;}
@media (max-width: 900px){.ce-form-grid{grid-template-columns:1fr;}}

/* Filter Bar (Clients) */
.ce-filters{display:grid;grid-template-columns:minmax(180px,1fr) 180px 220px auto;gap:10px;align-items:end;margin:10px 0 12px 0;}
.ce-filters .ce-input{height:44px;}
.ce-filters .ce-btn{height:44px;}
@media (max-width: 980px){.ce-filters{grid-template-columns:1fr 1fr;}}
@media (max-width: 560px){.ce-filters{grid-template-columns:1fr;}}

.ce-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:10px 0;}
@media (max-width:1100px){.ce-form-grid{grid-template-columns:1fr;}}
.ce-form-grid textarea{width:100%;padding:.55rem .7rem;border:1px solid var(--ce-border);border-radius:12px;}

/* WP "button" class in frontend contexts */
.ce-app .button,
.ce-login-shell .button{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.55rem .8rem;border-radius:999px;
  border:1px solid var(--ce-border);
  background:#fff;color:inherit;text-decoration:none;font-weight:800;cursor:pointer;
}
.ce-app .button-primary{background:var(--ce-primary);border-color:transparent;color:#fff;}

/* Signup Coach-Type Cards (Theme kompatibel) */
.ce-coach-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
@media (max-width:980px){.ce-coach-grid{grid-template-columns:1fr;}}
.ce-radio-card{
  border:1px solid var(--ce-border);
  border-radius:16px;
  padding:14px;
  background:#fff;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.ce-radio-card:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(2,6,23,.08);}
.ce-radio-card.is-selected{border-color:rgba(11,95,255,.35);box-shadow:0 10px 22px rgba(11,95,255,.12);}
.ce-coach-option-row{display:flex;gap:12px;align-items:flex-start;}
.ce-feature-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(2,6,23,.05);font-size:18px;}
.ce-small{font-size:.9rem;}
.ce-plan-note{margin:0 0 10px 0;}

/* Preview Mode: nur ansehen */
.ce-app.is-preview .ce-app-content input,
.ce-app.is-preview .ce-app-content select,
.ce-app.is-preview .ce-app-content textarea,
.ce-app.is-preview .ce-app-content button,
.ce-app.is-preview .ce-app-content form{
  pointer-events:none;
  opacity:.85;
}
.ce-app.is-preview .ce-app-content a.ce-btn,
.ce-app.is-preview .ce-app-content a.button{
  pointer-events:none;
  opacity:.85;
}
.ce-app.is-preview .ce-kanban [draggable="true"]{ pointer-events:none; }


/* Dashboard Minimal */
.ce-kpi-card{padding:16px;}
.ce-kpi-title{font-weight:800;font-size:.95rem;color:rgba(2,6,23,.80);}
.ce-kpi-number{margin-top:10px;font-weight:900;font-size:1.65rem;letter-spacing:-.02em;line-height:1.1;}
.ce-kpi-divider{font-weight:800;font-size:1rem;color:rgba(2,6,23,.55);}

.ce-dashboard-kanban{margin-top:0;}

/* Coaching Units – Monatskalender (v2.9.3) */
.ce-cal-header{display:flex;gap:14px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;}
.ce-cal-nav{display:flex;gap:10px;align-items:center;}
.ce-cal-month{font-weight:800;min-width:140px;text-align:center;}
.ce-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:8px;}
.ce-cal-weekday{font-size:12px;color:rgba(0,0,0,.55);text-align:center;}
.ce-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.ce-cal-cell{background:#fff;border-radius:14px;padding:10px;min-height:92px;box-shadow:0 1px 0 rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.05);position:relative;}
.ce-cal-cell.is-empty{background:transparent;border:none;box-shadow:none;}
.ce-cal-cell.is-today{border-color:rgba(0,0,0,.18);}
.ce-cal-cell.is-selected{outline:2px solid rgba(0,0,0,.18);}
.ce-cal-day{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:999px;font-weight:800;text-decoration:none;color:inherit;background:rgba(0,0,0,.04);}
.ce-cal-cell.has-items .ce-cal-day{background:rgba(0,0,0,.08);}
.ce-cal-items{margin-top:8px;display:flex;flex-direction:column;gap:4px;}
.ce-cal-item{font-size:12px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}


/* Coaching Units – Wochenansicht */
.ce-week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.ce-week-cell{background:#fff;border-radius:14px;padding:10px;min-height:160px;box-shadow:0 1px 0 rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.05);}
.ce-week-cell.is-today{border-color:rgba(0,0,0,.18);}
.ce-week-cell.is-selected{outline:2px solid rgba(0,0,0,.18);}
.ce-week-day{font-weight:800;font-size:12px;color:rgba(0,0,0,.65);}
.ce-week-items{margin-top:8px;display:flex;flex-direction:column;gap:6px;}
.ce-week-item{font-size:12px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ce-cal-weekday.is-today{font-weight:800;}
.ce-cal-weekday.is-selected{text-decoration:underline;}

@media (max-width: 900px){
  .ce-week-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 560px){
  .ce-week-grid{grid-template-columns:1fr;}
  .ce-week-cell{min-height:auto;}
  .ce-week-item{white-space:normal;}
}

@media (max-width: 820px){
  .ce-cal-grid{gap:6px;}
  .ce-cal-cell{padding:8px;min-height:78px;}
}

@media (max-width: 560px){
  .ce-cal-weekdays{gap:6px;}
  .ce-cal-grid{gap:6px;}
  .ce-cal-item{display:none;}
  .ce-cal-cell.has-items::after{content:"•";position:absolute;right:10px;top:10px;font-weight:800;color:rgba(0,0,0,.35);}
}

/* Analytics – minimaler Line Chart (ohne externe Libs) */
.ce-analytics-select{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;}
.ce-analytics-select__label{font-size:12px;font-weight:800;color:rgba(2,6,23,.65);}
.ce-analytics-select select{min-width:220px;max-width:100%;}

.ce-chart{display:flex;flex-direction:column;gap:10px;}
.ce-chart__title{font-weight:800;color:rgba(2,6,23,.80);}
.ce-chart__wrap{width:100%;}
.ce-chart__svg{width:100%;height:auto;display:block;}
.ce-chart__grid{stroke:rgba(2,6,23,.10);stroke-width:1;}
.ce-chart__line{stroke:rgba(11,95,255,.85);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.ce-chart__dot{fill:#fff;stroke:rgba(11,95,255,.85);stroke-width:2;}
.ce-chart__x{display:flex;justify-content:space-between;gap:10px;margin-top:6px;font-size:12px;color:rgba(2,6,23,.60);}
.ce-empty{padding:12px 0;color:rgba(2,6,23,.65);}

/* Upgrade – klarer Aufbau */
.ce-upgrade-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start;}
.ce-upgrade-current__label{font-size:12px;font-weight:800;color:rgba(2,6,23,.65);}
.ce-upgrade-current__value{margin-top:4px;font-weight:900;font-size:1.2rem;}

.ce-plan-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:12px;}
.ce-plan-card{border:1px solid rgba(2,6,23,.10);background:#fff;border-radius:14px;padding:14px;text-align:left;cursor:pointer;transition:box-shadow .15s ease,border-color .15s ease;min-width:0;}
.ce-plan-card:hover{border-color:rgba(2,6,23,.20);box-shadow:0 10px 22px rgba(2,6,23,.08);}
.ce-plan-card.is-selected{border-color:rgba(11,95,255,.35);box-shadow:0 10px 22px rgba(11,95,255,.12);}
.ce-plan-card__top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;}
.ce-plan-card__name{font-weight:900;}
.ce-plan-card__meta{margin-top:10px;}
.ce-upgrade-form .ce-btn{width:100%;}

@media (max-width: 980px){
  .ce-upgrade-grid{grid-template-columns:1fr;}
  .ce-plan-grid{grid-template-columns:1fr;}
}

@media (max-width: 420px){
  .ce-analytics-select select{min-width:0;width:100%;}
}