/* Narkose Hamburg OP-Planer – Praxis-Portal (Frontend)
   Farben koppeln an die Theme-Tokens der Website (Fallback in Klammern),
   damit sich alles nahtlos in den bestehenden Stil einfügt. */
.nhop-portal {
	--nhop-petrol:      var(--ink, #153f45);
	--nhop-petrol-dark: var(--ink-deep, #0c3035);
	--nhop-turquoise:   var(--teal, #2a8391);
	--nhop-mint:        var(--water-light, #e3eff1);
	--nhop-cream:       var(--paper, #f7f7f2);
	--nhop-accent:      var(--coral, #d47d62);
	--nhop-text:        var(--text, #1b2b2e);
	--nhop-muted:       var(--muted, #5e6b6c);
	--nhop-line:        var(--line, rgba(21,63,69,.17));
	--nhop-serif:       var(--serif, Georgia, "Times New Roman", serif);
	--nhop-yellow: #e0a92e;
	--nhop-green:  #2f9d68;
	--nhop-red:    #cf5a3f;
	--nhop-blue:   #3f78c4;
	color: var(--nhop-text);
	max-width: 1240px;
	margin: 0 auto;
}
.nhop-portal * { box-sizing: border-box; }

.nhop-portal-head { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:18px; flex-wrap:wrap; }
.nhop-kicker { text-transform:uppercase; letter-spacing:.15em; font-size:12px; color:var(--nhop-accent); margin:0 0 2px; font-weight:700; }
.nhop-portal-head h2 { margin:0; color:var(--nhop-petrol); font-size:28px; font-family:var(--nhop-serif); font-weight:400; }
.nhop-h3 { color:var(--nhop-petrol); margin:28px 0 12px; font-size:21px; font-family:var(--nhop-serif); font-weight:400; }
.nhop-muted { color:var(--nhop-muted); }
.nhop-muted a { color:var(--nhop-turquoise); }

/* Buttons */
.nhop-btn { display:inline-block; background:var(--nhop-turquoise); color:#fff; border:1px solid var(--nhop-turquoise); padding:9px 18px; border-radius:4px; text-decoration:none; cursor:pointer; font-size:15px; line-height:1.2; font-weight:650; }
.nhop-btn:hover { background:var(--nhop-petrol); border-color:var(--nhop-petrol); color:#fff; }
.nhop-btn-ghost { background:transparent; color:var(--nhop-petrol); border-color:var(--nhop-line); }
.nhop-btn-ghost:hover { background:rgba(21,63,69,.05); color:var(--nhop-petrol); border-color:var(--nhop-line); }
.nhop-btn-danger { background:var(--nhop-red); border-color:var(--nhop-red); }
.nhop-btn-danger:hover { background:#b8462f; }

/* ---- Auth-Karten (Login & Auswahl) – im Stil der Bestellportal-Karte ---- */
.nhop-authwrap { display:flex; justify-content:center; padding:30px 0 54px; }
.nhop-authcard { max-width:520px; width:100%; background:#fff; border:1px solid var(--nhop-line); border-radius:20px; padding:46px 44px; text-align:center; box-shadow:0 18px 46px rgba(21,63,69,.08); }
.nhop-authcard-icon { width:60px; height:60px; border-radius:50%; background:var(--nhop-mint); color:var(--nhop-turquoise); display:inline-flex; align-items:center; justify-content:center; margin-bottom:22px; }
.nhop-authcard-icon svg { width:28px; height:28px; fill:currentColor; }
.nhop-authcard-kicker { font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:var(--nhop-accent); font-weight:700; margin:0 0 10px; }
.nhop-authcard-title { font-family:var(--nhop-serif); font-weight:400; color:var(--nhop-petrol); font-size:30px; line-height:1.12; margin:0 0 14px; }
.nhop-authcard-text { color:var(--nhop-muted); font-size:15.5px; line-height:1.6; margin:0 auto 22px; max-width:400px; }
.nhop-authcard-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; background:var(--nhop-turquoise); color:#fff; text-decoration:none; font-size:15px; font-weight:650; padding:14px 30px; border-radius:4px; border:0; cursor:pointer; transition:background .2s, transform .2s; }
.nhop-authcard-btn:hover { background:var(--nhop-petrol); color:#fff; transform:translateY(-2px); }

/* Login-Formular in der Karte */
.nhop-authcard-form form { text-align:left; margin-top:6px; }
.nhop-authcard-form .login-username, .nhop-authcard-form .login-password { margin-bottom:12px; }
.nhop-authcard-form label { display:block; font-size:14px; margin-bottom:4px; color:var(--nhop-text); font-weight:600; }
.nhop-authcard-form input[type=text], .nhop-authcard-form input[type=password] { width:100%; padding:10px 12px; border:1px solid var(--nhop-line); border-radius:8px; font-size:15px; }
.nhop-authcard-form .login-remember { font-weight:400; }
.nhop-authcard-form .login-remember label { display:inline; font-weight:400; }
.nhop-authcard-form .login-submit #wp-submit, .nhop-authcard-form #wp-submit { width:100%; background:var(--nhop-turquoise); border:0; color:#fff; padding:12px 24px; border-radius:4px; cursor:pointer; font-weight:650; font-size:15px; margin-top:6px; }
.nhop-authcard-form .login-submit #wp-submit:hover, .nhop-authcard-form #wp-submit:hover { background:var(--nhop-petrol); }

/* Auswahlseite */
.nhop-choose { display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:900px; margin:30px auto 54px; }
.nhop-choose-card { background:#fff; border:1px solid var(--nhop-line); border-radius:20px; padding:42px 34px; text-align:center; box-shadow:0 18px 46px rgba(21,63,69,.08); display:flex; flex-direction:column; align-items:center; }
.nhop-choose-card .nhop-authcard-text { flex:1 1 auto; }
@media (max-width:720px){ .nhop-choose { grid-template-columns:1fr; } }

.nhop-note { background:var(--nhop-cream); border:1px solid #ece3d0; color:#7a5b2e; padding:12px 14px; border-radius:10px; margin:12px 0; }

/* Kalender */
.nhop-calendar { background:#fff; border:1px solid var(--nhop-line); border-radius:14px; padding:14px; margin-bottom:8px; }
.nhop-calendar .fc .fc-button-primary { background:var(--nhop-petrol); border-color:var(--nhop-petrol); }
.nhop-calendar .fc .fc-button-primary:hover { background:var(--nhop-petrol-dark); border-color:var(--nhop-petrol-dark); }
.nhop-calendar .fc .fc-button-primary:not(:disabled).fc-button-active { background:var(--nhop-turquoise); border-color:var(--nhop-turquoise); }
.nhop-calendar .fc .fc-toolbar-title { color:var(--nhop-petrol); font-family:var(--nhop-serif); font-weight:400; }
.nhop-calendar .fc-daygrid-day.fc-day-today { background:rgba(42,131,145,.10); }
.nhop-calendar .fc-daygrid-day { cursor:pointer; }
.nhop-calendar .fc-day-past { cursor:default; }
.nhop-bg-closed { background:repeating-linear-gradient(45deg,#f0f0f0,#f0f0f0 6px,#e8e8e8 6px,#e8e8e8 12px) !important; opacity:.5; }

/* Eigene Anfragen als Events */
.nhop-ev { border:0 !important; padding:1px 4px; font-weight:600; }
.nhop-ev-requested { background:var(--nhop-yellow) !important; color:#4a3a00 !important; }
.nhop-ev-confirmed { background:var(--nhop-green) !important; color:#fff !important; }
.nhop-ev-waitlist  { background:var(--nhop-blue) !important; color:#fff !important; }
.nhop-ev-rejected  { background:var(--nhop-red) !important; color:#fff !important; text-decoration:line-through; }
.nhop-ev-cancelled_practice, .nhop-ev-cancelled_admin { background:#b9c0c1 !important; color:#fff !important; text-decoration:line-through; }

/* Tabs / Tabelle „Meine Anfragen" */
.nhop-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.nhop-tab { padding:6px 14px; border-radius:999px; text-decoration:none; color:var(--nhop-petrol); border:1px solid var(--nhop-line); font-size:14px; }
.nhop-tab.is-active { background:var(--nhop-petrol); color:#fff; border-color:var(--nhop-petrol); }
.nhop-table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--nhop-line); border-radius:12px; overflow:hidden; }
.nhop-table th, .nhop-table td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--nhop-line); font-size:15px; }
.nhop-table thead th { background:var(--nhop-cream); color:var(--nhop-petrol); }
.nhop-table tr:last-child td { border-bottom:0; }
.nhop-link-danger { background:none; border:0; color:var(--nhop-red); cursor:pointer; text-decoration:underline; padding:0; font-size:14px; }

/* Status-Badges */
.nhop-badge { display:inline-block; padding:2px 10px; border-radius:12px; font-size:13px; font-weight:600; }
.nhop-badge-requested { background:#fbeecb; color:#6a5300; }
.nhop-badge-confirmed { background:#e3f3e8; color:#1e6b3a; }
.nhop-badge-waitlist  { background:#e2ecfb; color:#1e429f; }
.nhop-badge-rejected  { background:#fbe3de; color:#8a2c1b; }
.nhop-badge-cancelled_practice, .nhop-badge-cancelled_admin { background:#eceeee; color:#6b7b7e; }

/* Modal */
.nhop-modal { position:fixed; inset:0; background:rgba(12,48,53,.55); display:flex; align-items:center; justify-content:center; z-index:100000; padding:16px; }
.nhop-modal[hidden] { display:none; }
.nhop-modal-box { background:#fff; border-radius:14px; padding:24px; width:100%; max-width:460px; max-height:90vh; overflow:auto; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.nhop-modal-box h3 { margin-top:0; color:var(--nhop-petrol); font-family:var(--nhop-serif); font-weight:400; }
.nhop-modal-box form label { display:block; font-size:14px; margin:10px 0 4px; color:var(--nhop-text); }
.nhop-modal-box input, .nhop-modal-box textarea { width:100%; padding:9px 10px; border:1px solid var(--nhop-line); border-radius:8px; font-size:15px; }
.nhop-modal-box input[readonly] { background:var(--nhop-cream); }
.nhop-hint { font-size:12px; color:var(--nhop-muted); margin:8px 0 0; }
.nhop-modal-msg { background:#fbe3de; color:#8a2c1b; border-radius:8px; padding:8px 12px; margin-top:12px; font-size:14px; }
.nhop-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.nhop-detail-table { width:100%; border-collapse:collapse; }
.nhop-detail-table th { text-align:left; color:var(--nhop-muted); font-weight:600; padding:6px 10px 6px 0; vertical-align:top; white-space:nowrap; }
.nhop-detail-table td { padding:6px 0; }
body.nhop-modal-open { overflow:hidden; }

/* Toast */
.nhop-toast { position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px); background:var(--nhop-petrol); color:#fff; padding:12px 20px; border-radius:10px; opacity:0; transition:all .3s ease; z-index:100001; box-shadow:0 8px 24px rgba(0,0,0,.2); font-size:15px; }
.nhop-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

@media (max-width:600px) {
	.nhop-portal-head h2 { font-size:24px; }
	.nhop-authcard { padding:36px 24px; }
	.nhop-authcard-title { font-size:26px; }
	.nhop-table th:nth-child(2), .nhop-table td:nth-child(2) { display:none; }
}

/* ---- Mehrtags-Auswahl (Anfrage-Modal) ---- */
.nhop-pending { margin: 6px 0 10px; padding: 10px 12px; background: var(--nhop-cream); border: 1px solid var(--nhop-line); border-radius: 10px; }
.nhop-pending-label { margin: 0 0 6px; font-size: 13px; font-weight: 700; color: var(--nhop-petrol); }
.nhop-pending-list { list-style: none; margin: 0; padding: 0; }
.nhop-pending-list li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 0; border-bottom: 1px dashed var(--nhop-line); font-size: 14px; }
.nhop-pending-list li:last-child { border-bottom: 0; }
.nhop-pending-x { background: none; border: 0; color: var(--nhop-red); font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px; }
#nhop-modal-confirm .nhop-pending-list li { border-bottom: 1px solid var(--nhop-line); }

/* ---- Interne Übersicht ---- */
.nhop-verw-head-actions { display: flex; gap: 8px; }
.nhop-dashtiles { display: flex; gap: 14px; flex-wrap: wrap; margin: 4px 0 16px; }
.nhop-dtile { background: #fff; border: 1px solid var(--nhop-line); border-radius: 12px; padding: 14px 20px; min-width: 140px; }
.nhop-dtile-l { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--nhop-muted); }
.nhop-dtile-n { display: block; font-size: 26px; font-weight: 700; color: var(--nhop-petrol); line-height: 1.2; }
.nhop-verw .nhop-week { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 20px; }
.nhop-verw .nhop-week-day { flex: 1 1 90px; background: #fff; border: 1px solid var(--nhop-line); border-radius: 8px; padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; }
.nhop-verw .nhop-week-day.is-today { border-color: var(--nhop-turquoise); box-shadow: 0 0 0 1px var(--nhop-turquoise) inset; }
.nhop-verw .nhop-week-day.is-closed { background: #fafafa; color: var(--nhop-muted); }
.nhop-verw .nhop-week-dow { font-weight: 700; color: var(--nhop-petrol); }
.nhop-verw .nhop-week-date { font-size: 12px; color: var(--nhop-muted); }
.nhop-verw .nhop-week-num { font-size: 19px; font-weight: 700; color: var(--nhop-petrol); }
.nhop-verw .nhop-week-open { font-size: 12px; color: #8a6d00; }
.nhop-bulkbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: var(--nhop-cream); border: 1px solid var(--nhop-line); border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; }
.nhop-bulk-count { color: var(--nhop-muted); font-size: 14px; }
.nhop-verw-table .nhop-col-check { width: 34px; text-align: center; }
.nhop-verw-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.nhop-mini { display: inline-block; padding: 4px 10px; border-radius: 6px; border: 1px solid var(--nhop-line); background: #fff; color: var(--nhop-petrol); font-size: 13px; text-decoration: none; cursor: pointer; }
.nhop-mini:hover { border-color: var(--nhop-turquoise); }
.nhop-mini-primary { background: var(--nhop-turquoise); border-color: var(--nhop-turquoise); color: #fff; }
.nhop-mini-primary:hover { background: var(--nhop-petrol); border-color: var(--nhop-petrol); }

/* ---- Interne Übersicht: Ansichtsumschalter & Kalender ---- */
.nhop-viewswitch { display: inline-flex; border: 1px solid var(--nhop-line); border-radius: 999px; overflow: hidden; margin: 4px 0 16px; }
.nhop-vswitch { background: #fff; border: 0; padding: 8px 20px; font-size: 14px; font-weight: 650; color: var(--nhop-petrol); cursor: pointer; }
.nhop-vswitch.is-active { background: var(--nhop-petrol); color: #fff; }
.nhop-cal-legend { color: var(--nhop-muted); font-size: 13px; margin: 0 0 10px; }
.nhop-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: middle; margin: 0 3px 0 10px; border: 1px solid var(--nhop-line); }
.nhop-key-free { background: #e6f4ea; }
.nhop-key-full { background: #fde2e1; }
.nhop-key-closed { background: #eceeee; }
.nhop-cal-ev { border: 0 !important; font-weight: 600; }
.nhop-cal-ev-free   { background: #e6f4ea !important; color: #1e6b3a !important; }
.nhop-cal-ev-full   { background: #fde2e1 !important; color: #8a1f1b !important; }
.nhop-cal-ev-closed { background: #eceeee !important; color: #646970 !important; }
.nhop-day-stats { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--nhop-line); }
.nhop-day-stats span { color: var(--nhop-muted); font-size: 13px; }
.nhop-day-stats strong { font-size: 18px; color: var(--nhop-petrol); margin-right: 4px; }
#nhop-verw-day-modal .nhop-modal-box { max-width: 560px; }

/* ---- Feinschliff: Abstand unten + lesbare Kalender-Event-Schrift ---- */
.nhop-portal { padding-bottom: 48px; }
.nhop-verw-table { margin-bottom: 8px; }

/* FullCalendar setzt die Event-Textfarbe per --fc-event-text-color (Standard weiß).
   Für die hellen Tageskacheln dunkle, gut lesbare Schrift erzwingen. */
.nhop-cal-ev-free   { --fc-event-text-color: #1e6b3a; }
.nhop-cal-ev-full   { --fc-event-text-color: #8a1f1b; }
.nhop-cal-ev-closed { --fc-event-text-color: #646970; }
.nhop-ev-requested  { --fc-event-text-color: #4a3a00; }
.nhop-cal-ev-free   .fc-event-main, .nhop-cal-ev-free   .fc-event-title { color: #1e6b3a !important; }
.nhop-cal-ev-full   .fc-event-main, .nhop-cal-ev-full   .fc-event-title { color: #8a1f1b !important; }
.nhop-cal-ev-closed .fc-event-main, .nhop-cal-ev-closed .fc-event-title { color: #646970 !important; }
.nhop-ev-requested  .fc-event-main, .nhop-ev-requested  .fc-event-title { color: #4a3a00 !important; }
.nhop-cal-ev .fc-event-main, .nhop-ev .fc-event-main { font-weight: 700; }