/* ServicePortal – Frontend */
.sp-portal{--sp-primary:#2563eb;--sp-border:#e5e7eb;--sp-muted:#6b7280;--sp-bg:#f9fafb;max-width:980px;margin:0 auto;color:#1f2937;font-size:15px;line-height:1.6;}
.sp-portal *{box-sizing:border-box;}
.sp-portal a{color:var(--sp-primary);text-decoration:none;}
.sp-portal a:hover{text-decoration:underline;}

/* Techniker-Portal: nutzt die volle verfügbare Breite (statt der schmalen
   980px des Kunden-Portals) – mehr Platz für Tabellen, Listen und den
   zweispaltigen Anfragen-Bereich. Wie breit das tatsächlich wird, hängt
   zusätzlich vom WordPress-Theme/Seitenlayout ab, da das Plugin den
   umgebenden Seiteninhalt nicht beeinflusst. */
.sp-portal.sp-portal-wide{max-width:none;width:100%;margin:0;padding:0 clamp(12px, 2vw, 32px);}

/* Topbar */
.sp-topbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding:0 0 18px;border-bottom:1px solid var(--sp-border);margin-bottom:24px;}
.sp-topbar .sp-company{font-weight:700;font-size:18px;}
.sp-topbar .sp-company small{display:block;font-weight:400;color:var(--sp-muted);font-size:13px;}
.sp-nav{display:flex;gap:8px;flex-wrap:wrap;}
.sp-nav a{padding:8px 14px;border-radius:6px;border:1px solid var(--sp-border);background:#fff;font-size:14px;}
.sp-nav a.active{background:var(--sp-primary);color:#fff;border-color:var(--sp-primary);}

/* Buttons */
.sp-btn{display:inline-block;background:var(--sp-primary);color:#fff;border:none;padding:10px 18px;border-radius:6px;font-size:15px;cursor:pointer;text-decoration:none;}
.sp-btn:hover{background:#1d4ed8;color:#fff;text-decoration:none;}
.sp-btn-secondary{background:#fff;color:#1f2937;border:1px solid var(--sp-border);}
.sp-btn-secondary:hover{background:var(--sp-bg);color:#1f2937;}
.sp-btn-danger{background:#fff;color:#b91c1c;border:1px solid #fecaca;}
.sp-btn-danger:hover{background:#fef2f2;color:#b91c1c;}

/* Cards & stats */
.sp-stats{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px;}
.sp-stat{flex:1;min-width:130px;background:#fff;border:1px solid var(--sp-border);border-radius:10px;padding:16px 18px;}
.sp-stat .num{font-size:28px;font-weight:700;line-height:1;}
.sp-stat .lbl{color:var(--sp-muted);font-size:13px;margin-top:6px;}
.sp-card{background:#fff;border:1px solid var(--sp-border);border-radius:10px;padding:22px;margin-bottom:20px;}
.sp-card h2{margin-top:0;font-size:18px;}

/* Formatierter Nachrichteninhalt (z. B. aus per E-Mail eingegangenen
   Anfragen/Antworten): Formatierung sichtbar lassen, aber Bilder,
   Tabellen und lange Inhalte am Rahmen der Nachricht begrenzen. */
.sp-message-body{overflow-wrap:anywhere;word-break:break-word;}
.sp-message-body img{max-width:100%;height:auto;}
.sp-message-body table{max-width:100%;border-collapse:collapse;}
.sp-message-body td,.sp-message-body th{border:1px solid var(--sp-border);padding:4px 8px;}
.sp-message-body blockquote{border-left:3px solid var(--sp-border);margin:8px 0;padding:2px 12px;color:#6b7280;}
.sp-message-body a{color:var(--sp-brand,#e30613);text-decoration:underline;word-break:break-all;}
.sp-message-body p{margin:0 0 8px;}
.sp-message-body ul,.sp-message-body ol{margin:0 0 8px;padding-left:22px;}
.sp-message-body pre{white-space:pre-wrap;overflow-x:auto;background:#f8f9fa;padding:8px;border-radius:6px;}

/* Status badges */
.sp-badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;color:#fff;white-space:nowrap;}

/* Tables */
.sp-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--sp-border);border-radius:10px;overflow:hidden;}
.sp-table th,.sp-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--sp-border);font-size:14px;}
.sp-table th{background:var(--sp-bg);font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--sp-muted);}
.sp-table tr:last-child td{border-bottom:none;}
.sp-table tr:hover td{background:#fcfcfd;}

/* Forms */
.sp-field{margin-bottom:18px;}
.sp-field label.sp-label{display:block;font-weight:600;margin-bottom:6px;font-size:14px;}
.sp-field .sp-req{color:#dc2626;}
.sp-field input[type=text],.sp-field input[type=email],.sp-field input[type=number],
.sp-field input[type=date],.sp-field input[type=password],.sp-field select,.sp-field textarea{
	width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:15px;background:#fff;}
.sp-field textarea{min-height:90px;}
.sp-field .sp-help{color:var(--sp-muted);font-size:13px;margin-top:4px;}
.sp-choice{display:block;margin:6px 0;font-size:15px;font-weight:400;}
.sp-choice input{margin-right:8px;}

/* Service picker */
.sp-services{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;}
.sp-service{display:block;background:#fff;border:1px solid var(--sp-border);border-radius:10px;padding:18px;transition:.15s;}
.sp-service:hover{border-color:var(--sp-primary);box-shadow:0 2px 8px rgba(37,99,235,.08);text-decoration:none;}
.sp-service .name{font-weight:700;font-size:16px;color:#1f2937;}
.sp-service .cat{color:var(--sp-muted);font-size:13px;margin:4px 0 10px;}
.sp-service .price{font-size:14px;color:#1f2937;}
.sp-service .price em{color:#7c3aed;font-style:normal;font-weight:600;}

/* Detail rows */
.sp-detail{display:grid;grid-template-columns:200px 1fr;gap:8px 16px;}
.sp-detail dt{color:var(--sp-muted);font-size:14px;}
.sp-detail dd{margin:0;font-size:15px;}

/* Notices */
.sp-notice{padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:14px;}
.sp-notice-success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;}
.sp-notice-error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;}
.sp-notice-info{background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;}

.sp-empty{text-align:center;padding:48px 20px;color:var(--sp-muted);}
.sp-muted{color:var(--sp-muted);}
@media(max-width:600px){.sp-detail{grid-template-columns:1fr;gap:2px 0;}.sp-detail dt{margin-top:10px;}}

/* Techniker: Ansichten-Seitenleiste (links) */
.sp-tech-layout{display:flex;gap:22px;align-items:flex-start;}
.sp-tech-side{flex:0 0 232px;position:sticky;top:16px;display:flex;flex-direction:column;gap:4px;}
.sp-tech-sidelbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--sp-muted);font-weight:700;margin:4px 2px 6px;}
.sp-tech-view{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:8px;border:1px solid transparent;color:#1f2937;font-size:14px;}
.sp-tech-view:hover{background:#fff;border-color:var(--sp-border);text-decoration:none;}
.sp-tech-view.active{background:var(--sp-primary);color:#fff;border-color:var(--sp-primary);}
.sp-tech-view.active:hover{color:#fff;}
.sp-tech-view .ct{background:var(--sp-bg);border:1px solid var(--sp-border);color:var(--sp-muted);font-size:12px;font-weight:600;border-radius:999px;padding:1px 8px;min-width:24px;text-align:center;}
.sp-tech-view.active .ct{background:rgba(255,255,255,.22);color:#fff;border-color:transparent;}
.sp-tech-gear{display:flex;align-items:center;gap:8px;margin-top:14px;padding:10px 12px;border-radius:8px;border:1px dashed var(--sp-border);color:var(--sp-muted);font-size:13px;}
.sp-tech-gear:hover{background:#fff;color:var(--sp-primary);border-color:var(--sp-primary);text-decoration:none;}
.sp-tech-main{flex:1;min-width:0;}
.sp-tech-mainhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;}
.sp-tech-mainhead h2{font-size:20px;margin:0;}
.sp-tech-search{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.sp-tech-search input[type=search]{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;min-width:230px;}
@media(max-width:760px){
  .sp-tech-layout{flex-direction:column;}
  .sp-tech-side{position:static;flex-basis:auto;width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;}
  .sp-tech-sidelbl{width:100%;}
  .sp-tech-gear{margin-top:0;}
}

/* SLA-Überschreitung */
.sp-sla-flag{display:inline-block;background:#dc2626;color:#fff;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px;letter-spacing:.02em;white-space:nowrap;}

/* Paginierung der Anfragenliste */
.sp-pagination{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0;font-size:13px;color:#6b7280;}
.sp-pagination-info{white-space:nowrap;}
.sp-pagination-per{margin:0;margin-left:auto;}
.sp-pagination-per select{padding:4px 8px;font-size:13px;border:1px solid var(--sp-border);border-radius:7px;background:#fff;color:#374151;margin-left:4px;}
.sp-pagination-nav{display:inline-flex;align-items:center;gap:4px;}
.sp-page-link{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 8px;border:1px solid var(--sp-border);border-radius:7px;background:#fff;color:#374151;text-decoration:none;font-size:13px;}
a.sp-page-link:hover{background:#f8f9fa;}
.sp-page-link.current{background:#111827;color:#fff;border-color:#111827;font-weight:600;}
.sp-page-link.disabled{opacity:.4;pointer-events:none;}
.sp-page-gap{padding:0 4px;color:#9ca3af;}

/* Excel-artige Spaltenfilter + Sortierung in der Anfragenliste */
.sp-filter-form{margin:0;}
.sp-sort-link{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:3px;white-space:nowrap;}
.sp-sort-link:hover{text-decoration:underline;}
.sp-sort-arrow{font-size:9px;color:#E30613;}
.sp-filter-row td{padding:4px 6px;vertical-align:top;background:#fafbfc;border-bottom:1px solid var(--sp-border);}
.sp-filter-row input[type="text"],.sp-filter-row input[type="date"],.sp-filter-row select{width:100%;font-size:12px;padding:3px 5px;border:1px solid var(--sp-border);border-radius:6px;background:#fff;color:#374151;box-sizing:border-box;}
.sp-filter-row .sp-filter-date{white-space:nowrap;}
.sp-filter-row .sp-filter-date input{width:auto;max-width:100%;display:block;margin-bottom:3px;}

/* Wissensdatenbank: Standardschrift Calibri, Fallback Arial – inkl. Überschriften */
.sp-kb,
.sp-kb h1, .sp-kb h2, .sp-kb h3, .sp-kb h4, .sp-kb h5, .sp-kb h6,
.sp-kb-content,
.sp-kb-content h1, .sp-kb-content h2, .sp-kb-content h3,
.sp-kb-content h4, .sp-kb-content h5, .sp-kb-content h6{
	font-family:"Calibri","Calibri Light",Arial,"Helvetica Neue",Helvetica,sans-serif;
}

/* Kompakte Import-Tabs (Wissensdatenbank) – ohne JavaScript */
.sp-import-tabs .sp-tab-radio{position:absolute;width:0;height:0;opacity:0;pointer-events:none;}
.sp-import-tabs .sp-tabbar{display:flex;gap:4px;border-bottom:1px solid var(--sp-border);margin:-4px 0 14px;flex-wrap:wrap;}
.sp-import-tabs .sp-tab{padding:8px 14px;cursor:pointer;font-weight:600;font-size:14px;color:#6b7280;border-bottom:2px solid transparent;margin-bottom:-1px;user-select:none;}
.sp-import-tabs .sp-tab:hover{color:#111;}
.sp-import-tabs .sp-tab-panel{display:none;}
.sp-import-tabs #sp-imp-pdf:checked ~ .sp-tab-panel.sp-tab-pdf{display:block;}
.sp-import-tabs #sp-imp-zip:checked ~ .sp-tab-panel.sp-tab-zip{display:block;}
.sp-import-tabs #sp-imp-pdf:checked ~ .sp-tabbar label[for="sp-imp-pdf"],
.sp-import-tabs #sp-imp-zip:checked ~ .sp-tabbar label[for="sp-imp-zip"]{color:#E30613;border-bottom-color:#E30613;}
.sp-import-tabs .sp-tab-radio:focus-visible ~ .sp-tabbar label{outline:2px solid #E30613;outline-offset:2px;}

/* ===== Mobile-Navigation (Hamburger, ohne JavaScript) ===== */
.sp-navtoggle-cb{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
.sp-navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:46px;height:40px;padding:9px;border:1px solid var(--sp-border);border-radius:8px;background:#fff;cursor:pointer;box-sizing:border-box;}
.sp-navtoggle span{display:block;height:2px;width:100%;background:#111;border-radius:2px;transition:transform .2s ease,opacity .2s ease;}

@media(max-width:760px){
  .sp-topbar{align-items:center;}
  .sp-topbar .sp-company{flex:1;min-width:0;}
  .sp-navtoggle{display:flex;}
  .sp-topbar .sp-nav{display:none;order:3;width:100%;flex-direction:column;gap:6px;margin-top:10px;}
  .sp-navtoggle-cb:checked ~ .sp-nav{display:flex;}
  .sp-navtoggle-cb:checked ~ .sp-navtoggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .sp-navtoggle-cb:checked ~ .sp-navtoggle span:nth-child(2){opacity:0;}
  .sp-navtoggle-cb:checked ~ .sp-navtoggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .sp-nav a{display:block;width:100%;padding:12px 14px;font-size:15px;box-sizing:border-box;}
}

/* ===== Allgemeiner mobiler Feinschliff ===== */
@media(max-width:600px){
  .sp-card{padding:14px;overflow-x:auto;}
  .sp-btn,button,input[type="submit"]{min-height:42px;}
  input[type="text"],input[type="email"],input[type="date"],input[type="number"],input[type="password"],select,textarea{font-size:16px;}
  h1{font-size:22px !important;}
}

/* Sicherheitsabstand im installierten App-Modus (Notch/Statusleiste) */
@media(display-mode:standalone){
  body{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);}
}