/* SK Portal – portal.css (v0.7.0, Design-Tokens) */

/* ── Portal Container ────────────────────────────── */
.skp-portal{background:var(--sk-bg);border:1px solid var(--sk-border);border-radius:var(--sk-radius-xl);padding:var(--sk-space-6);box-shadow:var(--sk-shadow-lg)}
.skp-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sk-space-4);margin-bottom:var(--sk-space-5)}
.skp-header h2{margin:0 0 var(--sk-space-1);font-size:var(--sk-text-3xl)}
.skp-header p{margin:0;color:var(--sk-text-muted)}

/* ── Navigation ──────────────────────────────────── */
.skp-nav{display:flex;gap:var(--sk-space-2);flex-wrap:wrap;margin:0 0 var(--sk-space-5)}
.skp-nav__link{display:inline-flex;padding:var(--sk-space-2) var(--sk-space-3);border-radius:var(--sk-radius-full);background:var(--sk-bg-muted);color:var(--sk-text);text-decoration:none;font-weight:var(--sk-weight-semibold);transition:background var(--sk-transition)}
.skp-nav__link:hover{background:var(--sk-border)}
.skp-nav__link.is-active{background:var(--sk-primary);color:#fff}

/* ── Section / Cards ─────────────────────────────── */
.skp-section{margin-top:var(--sk-space-3)}
.skp-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sk-space-4)}
.skp-card{background:var(--sk-bg-subtle);border:1px solid var(--sk-border);border-radius:var(--sk-radius-xl);padding:var(--sk-space-5)}
.skp-card--nested{background:var(--sk-bg)}
.skp-card h3,.skp-card h4{margin-top:0}
.skp-kpi{font-size:var(--sk-text-3xl);font-weight:800;color:var(--sk-primary);line-height:var(--sk-leading-tight);margin:var(--sk-space-1) 0}

/* ── Badges ──────────────────────────────────────── */
.skp-pill-row{display:flex;gap:var(--sk-space-2);flex-wrap:wrap;margin-top:var(--sk-space-2)}
.skp-badge{display:inline-flex;align-items:center;padding:var(--sk-space-1) var(--sk-space-2);border-radius:var(--sk-radius-full);font-size:var(--sk-text-xs);font-weight:var(--sk-weight-semibold);background:var(--sk-bg-muted);color:var(--sk-text)}
.skp-badge--success{background:var(--sk-success-bg);color:var(--sk-success)}
.skp-badge--danger{background:var(--sk-error-bg);color:var(--sk-error)}
.skp-badge--warning{background:var(--sk-warning-bg);color:var(--sk-warning)}
.skp-badge--info{background:var(--sk-info-bg);color:var(--sk-info)}
.skp-badge--default{background:var(--sk-bg-muted);color:var(--sk-gray-700)}

/* ── Login-Box ───────────────────────────────────── */
.skp-login-box{max-width:440px;background:var(--sk-bg-subtle);border:1px solid var(--sk-border);border-radius:var(--sk-radius-xl);padding:var(--sk-space-5)}
.skp-login-box .login-username,.skp-login-box .login-password,.skp-login-box .login-remember,.skp-login-box .login-submit{margin:0 0 var(--sk-space-3)}
.skp-login-box input[type=text],.skp-login-box input[type=password]{width:100%;padding:var(--sk-space-2) var(--sk-space-3);border:1px solid var(--sk-border-strong);border-radius:var(--sk-radius)}

/* ── Notices ─────────────────────────────────────── */
.skp-notice{padding:var(--sk-space-3) var(--sk-space-4);border-radius:var(--sk-radius-lg);margin:0 0 var(--sk-space-5)}
.skp-notice--error{background:var(--sk-error-bg);border:1px solid var(--sk-error-border);color:var(--sk-error)}
.skp-notice--success{background:var(--sk-success-bg);border:1px solid var(--sk-success-border);color:var(--sk-success);padding:var(--sk-space-3) var(--sk-space-4);border-radius:var(--sk-radius-lg);margin:0 0 var(--sk-space-5)}

/* ── Tables ──────────────────────────────────────── */
.skp-table-wrap{overflow:auto}
.skp-table{width:100%;border-collapse:collapse;font-size:var(--sk-text-sm)}
.skp-table th,.skp-table td{padding:var(--sk-space-2) var(--sk-space-3);border-bottom:1px solid var(--sk-border);text-align:left;vertical-align:top}

/* ── Meta-Grid ───────────────────────────────────── */
.skp-meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sk-space-3);margin-bottom:var(--sk-space-4)}
.skp-meta-item{background:var(--sk-bg);border:1px solid var(--sk-border);border-radius:var(--sk-radius-lg);padding:var(--sk-space-3);display:flex;flex-direction:column;gap:var(--sk-space-1)}
.skp-meta-item span{font-size:var(--sk-text-xs);color:var(--sk-text-subtle)}

/* ── Button-Link ─────────────────────────────────── */
.skp-button-link{display:inline-flex;padding:var(--sk-space-2) var(--sk-space-3);border-radius:var(--sk-radius-full);background:var(--sk-primary);color:#fff;text-decoration:none;font-weight:var(--sk-weight-semibold);transition:background var(--sk-transition)}

/* ── Forms ────────────────────────────────────────── */
.skp-form{max-width:480px}
.skp-form-row{margin:0 0 var(--sk-space-3)}
.skp-form-row label{display:block;font-weight:var(--sk-weight-semibold);margin:0 0 var(--sk-space-1);font-size:var(--sk-text-sm)}
.skp-form-row input[type=text],.skp-form-row input[type=email],.skp-form-row input[type=tel],.skp-form-row input[type=password],.skp-form-row input[type=date],.skp-form-row textarea,.skp-form-row select{width:100%;padding:var(--sk-space-2) var(--sk-space-3);border:1px solid var(--sk-border-strong);border-radius:var(--sk-radius);font-size:var(--sk-text-sm)}
.skp-form-row textarea{min-height:80px;resize:vertical}
.skp-form-actions{margin-top:var(--sk-space-4)}

/* ── Paging ──────────────────────────────────────── */
.skp-paging{display:flex;gap:var(--sk-space-1);flex-wrap:wrap;margin-top:var(--sk-space-4);align-items:center}
.skp-paging a,.skp-paging span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;padding:var(--sk-space-1) var(--sk-space-2);border-radius:var(--sk-radius);font-weight:var(--sk-weight-semibold);text-decoration:none;font-size:var(--sk-text-sm)}
.skp-paging a{background:var(--sk-bg-muted);color:var(--sk-text)}
.skp-paging a:hover{background:var(--sk-border)}
.skp-paging span.is-current{background:var(--sk-primary);color:#fff}

/* ── Detail ──────────────────────────────────────── */
.skp-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sk-space-3);margin-bottom:var(--sk-space-4)}
.skp-detail-actions{display:flex;gap:var(--sk-space-2);flex-wrap:wrap;margin-top:var(--sk-space-4)}

/* ── Board Dashboard ─────────────────────────────── */
.skp-board-dashboard{background:var(--sk-bg-subtle);border:1px solid var(--sk-border);border-radius:var(--sk-radius-lg);padding:var(--sk-space-4);margin-bottom:var(--sk-space-4);display:flex;flex-wrap:wrap;gap:var(--sk-space-4);align-items:center}
.skp-board-stat{text-align:center;min-width:70px}
.skp-board-stat-val{display:block;font-size:1.6rem;font-weight:800;color:var(--sk-primary);line-height:var(--sk-leading-tight)}
.skp-board-stat-lbl{font-size:var(--sk-text-xs);color:var(--sk-text-subtle)}
.skp-board-progress{flex:1 1 100%;height:8px;background:var(--sk-border);border-radius:var(--sk-radius-full);overflow:hidden}
.skp-board-progress-bar{height:100%;background:linear-gradient(90deg,var(--sk-primary),var(--sk-green-400));border-radius:var(--sk-radius-full);transition:width var(--sk-transition-slow)}
.skp-board-stat-row{flex:1 1 100%;display:flex;gap:var(--sk-space-1);flex-wrap:wrap}

/* ── Board Columns ───────────────────────────────── */
.skp-board{display:flex;gap:var(--sk-space-4);overflow-x:auto;padding:var(--sk-space-1) 0 var(--sk-space-4);min-height:300px}
.skp-board-column{flex:0 0 280px;background:var(--sk-bg-muted);border-radius:var(--sk-radius-lg);display:flex;flex-direction:column;max-height:70vh}
.skp-board-column-header{display:flex;justify-content:space-between;align-items:center;padding:var(--sk-space-3) var(--sk-space-3) var(--sk-space-2);border-bottom:1px solid var(--sk-border)}
.skp-board-column-header h4{margin:0;font-size:var(--sk-text-sm)}
.skp-board-add{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--sk-primary);font-weight:var(--sk-weight-bold);line-height:1;padding:0 var(--sk-space-1)}
.skp-board-column-body{flex:1;overflow-y:auto;padding:var(--sk-space-2) var(--sk-space-2);display:flex;flex-direction:column;gap:var(--sk-space-2);min-height:40px}

/* ── Board Cards ─────────────────────────────────── */
.skp-board-card{background:var(--sk-bg);border:1px solid var(--sk-border);border-radius:var(--sk-radius);padding:var(--sk-space-2) var(--sk-space-3);cursor:grab;transition:box-shadow var(--sk-transition)}
.skp-board-card:hover{box-shadow:var(--sk-shadow)}
.skp-board-card--ghost{opacity:.4;border:2px dashed var(--sk-primary)}
.skp-board-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sk-space-1)}
.skp-board-card-title{font-weight:var(--sk-weight-semibold);font-size:var(--sk-text-sm);flex:1;cursor:pointer}
.skp-board-card-actions{display:flex;gap:2px}
.skp-board-card-actions button{background:none;border:none;cursor:pointer;font-size:var(--sk-text-sm);color:var(--sk-text-subtle);padding:0 3px;transition:color var(--sk-transition)}
.skp-board-card-actions button:hover{color:var(--sk-text)}
.skp-board-card-desc{margin:var(--sk-space-1) 0 0;font-size:var(--sk-text-xs);color:var(--sk-text-subtle);cursor:pointer}
.skp-board-card .skp-pill-row{margin-top:var(--sk-space-1)}

/* ── Board Tabs ──────────────────────────────────── */
.skp-board-tabs{display:flex;gap:var(--sk-space-2);flex-wrap:wrap}

/* ── Modal ────────────────────────────────────────── */
.skp-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:99999;display:flex;align-items:center;justify-content:center;padding:var(--sk-space-4)}
.skp-modal{background:var(--sk-bg);border-radius:var(--sk-radius-xl);padding:var(--sk-space-6);max-width:520px;width:100%;box-shadow:var(--sk-shadow-lg);max-height:80vh;overflow-y:auto}
.skp-modal-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sk-space-2);margin-bottom:var(--sk-space-4)}
.skp-modal-header h3{margin:0}
.skp-modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--sk-text-subtle);padding:0 var(--sk-space-1);line-height:1;transition:color var(--sk-transition)}
.skp-modal-close:hover{color:var(--sk-text)}
.skp-modal-body h4{margin:var(--sk-space-4) 0 var(--sk-space-1)}
.skp-modal-body p{color:var(--sk-text-muted)}

/* ── WhatsApp Channel ────────────────────────────── */
.skp-wa-channel{max-width:600px;margin:0 auto;border-radius:var(--sk-radius-xl);overflow:hidden;border:1px solid var(--sk-border)}
.skp-wa-header{background:var(--sk-primary);color:#fff;padding:var(--sk-space-3) var(--sk-space-5);display:flex;justify-content:space-between;align-items:center}
.skp-wa-header-name{font-weight:var(--sk-weight-bold);font-size:var(--sk-text-lg)}
.skp-wa-count{font-size:var(--sk-text-xs);opacity:.8}
.skp-wa-feed{background:var(--sk-bg-muted);padding:var(--sk-space-3) var(--sk-space-3);display:flex;flex-direction:column;gap:var(--sk-space-2);max-height:70vh;overflow-y:auto}
.skp-wa-empty{text-align:center;color:var(--sk-text-subtle);padding:var(--sk-space-6) 0}
.skp-wa-bubble{background:var(--sk-bg);border-radius:0 var(--sk-radius-lg) var(--sk-radius-lg) var(--sk-radius-lg);padding:var(--sk-space-2) var(--sk-space-3);box-shadow:var(--sk-shadow-sm);max-width:92%}
.skp-wa-time{display:block;font-size:var(--sk-text-xs);color:var(--sk-text-subtle);margin-bottom:var(--sk-space-1)}
.skp-wa-card{display:flex;gap:var(--sk-space-3);text-decoration:none;background:var(--sk-bg-subtle);border:1px solid var(--sk-border);border-radius:var(--sk-radius);padding:var(--sk-space-2);margin-bottom:var(--sk-space-1);transition:background var(--sk-transition)}
.skp-wa-card:hover{background:var(--sk-bg-muted)}
.skp-wa-card-img{flex:0 0 80px;width:80px;height:80px;overflow:hidden;border-radius:var(--sk-radius-sm)}
.skp-wa-card-thumb{width:100%;height:100%;object-fit:cover;display:block}
.skp-wa-card-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.skp-wa-card-domain{font-size:var(--sk-text-xs);color:var(--sk-text-subtle);text-transform:uppercase;letter-spacing:var(--sk-tracking-wide)}
.skp-wa-card-title{font-weight:var(--sk-weight-semibold);font-size:var(--sk-text-sm);color:var(--sk-text);line-height:var(--sk-leading-tight);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.skp-wa-card-text{font-size:var(--sk-text-xs);color:var(--sk-text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.skp-wa-deeplink{display:block;font-size:var(--sk-text-xs);color:var(--sk-info);margin-bottom:var(--sk-space-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skp-wa-footer{display:flex;align-items:center;gap:var(--sk-space-2);justify-content:space-between}
.skp-wa-forward{background:none;border:none;cursor:pointer;color:var(--sk-text-subtle);padding:var(--sk-space-1);border-radius:var(--sk-radius-full);transition:background var(--sk-transition),color var(--sk-transition)}
.skp-wa-forward:hover{background:var(--sk-bg-muted);color:var(--sk-primary)}
.skp-wa-badges{display:flex;flex-wrap:wrap;gap:var(--sk-space-1);margin-top:var(--sk-space-1)}
.skp-wa-badge{display:inline-block;padding:2px var(--sk-space-2);border-radius:var(--sk-radius);font-size:var(--sk-text-xs);font-weight:var(--sk-weight-semibold);text-decoration:none}
.skp-wa-badge-pdf{background:var(--sk-error);color:#fff}
.skp-wa-badge-pdf:hover{background:#b91c1c}
.skp-wa-badge-cat{background:var(--sk-bg-muted);color:var(--sk-gray-700)}
.skp-wa-badge-type{background:var(--sk-info-bg);color:var(--sk-info)}

/* ── Responsive ──────────────────────────────────── */
@media (max-width:700px){
  .skp-header{flex-direction:column}
  .skp-portal{padding:var(--sk-space-4)}
  .skp-board{flex-direction:column}
  .skp-board-column{flex:none;max-height:none}
}

/* ── Contrast Fix (Button-Links) ─────────────────── */
.skp-portal .skp-button-link,
.skp-portal .skp-button-link:link,
.skp-portal .skp-button-link:visited,
.skp-portal .skp-button-link:hover,
.skp-portal .skp-button-link:focus,
.skp-portal .skp-button-link:active{color:#ffffff !important;background:var(--sk-primary);text-decoration:none;border:1px solid var(--sk-primary)}
.skp-portal .skp-button-link:hover,.skp-portal .skp-button-link:focus{background:var(--sk-primary-hover);border-color:var(--sk-primary-hover)}
.skp-portal .skp-nav__link *,.skp-portal .skp-nav__link,.skp-portal .skp-nav__link:link,.skp-portal .skp-nav__link:visited{color:inherit !important}

/* ── Stammdaten-View (SKP-37) ────────────────────── */
.skp-tab-nav{display:flex;gap:var(--sk-space-2);margin-bottom:var(--sk-space-6);border-bottom:2px solid var(--sk-border)}
.skp-tab-link{padding:var(--sk-space-2) var(--sk-space-4);border-radius:var(--sk-radius) var(--sk-radius) 0 0;text-decoration:none;color:var(--sk-text-muted);font-weight:500;transition:background .15s,color .15s}
.skp-tab-link:hover{background:var(--sk-bg-muted);color:var(--sk-text)}
.skp-tab-link.is-active{background:var(--sk-primary);color:#fff;border-bottom-color:var(--sk-primary)}
.skp-sd-table-wrap{overflow-x:auto}
.skp-sd-table{width:100%;border-collapse:collapse;font-size:.9rem}
.skp-sd-table th{background:var(--sk-bg-muted);padding:var(--sk-space-2) var(--sk-space-3);text-align:left;font-weight:600;border-bottom:2px solid var(--sk-border);white-space:nowrap}
.skp-sd-table td{padding:var(--sk-space-2) var(--sk-space-3);border-bottom:1px solid var(--sk-border);vertical-align:middle}
.skp-sd-table tr:hover td{background:var(--sk-bg-muted)}
.skp-sd-actions{white-space:nowrap;text-align:right}
.skp-sd-name{font-weight:500}
.skp-sd-input{width:100%;max-width:220px;padding:4px 8px;border:1px solid var(--sk-primary);border-radius:var(--sk-radius);font-size:.9rem}
.skp-btn--small{padding:4px 10px;font-size:.8rem}
.skp-dialog-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9999;display:flex;align-items:center;justify-content:center}
.skp-dialog{background:var(--sk-bg);border-radius:var(--sk-radius);box-shadow:0 8px 32px rgba(0,0,0,.25);padding:var(--sk-space-6);min-width:340px;max-width:90vw}
.skp-dialog__title{margin:0 0 var(--sk-space-4);font-size:1.1rem;font-weight:700;color:var(--sk-primary)}
.skp-dialog__actions{display:flex;gap:var(--sk-space-3);justify-content:flex-end;margin-top:var(--sk-space-5)}
.skp-form-group{margin:var(--sk-space-4) 0}
.skp-form-group label{display:block;font-weight:600;margin-bottom:var(--sk-space-1)}
.skp-select{width:100%;padding:6px 10px;border:1px solid var(--sk-border);border-radius:var(--sk-radius);font-size:.9rem;background:var(--sk-bg);color:var(--sk-text)}
@media(max-width:700px){.skp-sd-table td,.skp-sd-table th{padding:var(--sk-space-1) var(--sk-space-2)}}
/* SKP-39: Reminder-Toggle */
.skp-board-reminders-wrap{margin:var(--sk-space-2) 0 var(--sk-space-1)}
.skp-board-reminders-toggle{background:none;border:none;padding:2px 0;cursor:pointer;font-size:.85rem;color:var(--sk-text-muted,#666);display:inline-flex;align-items:center;gap:4px}
.skp-board-reminders-toggle:hover{color:var(--sk-primary);text-decoration:underline}
.skp-reminders-count{font-weight:700}
.skp-reminders-arrow{font-size:.7rem;transition:transform .15s}
.skp-board-reminders-list{list-style:none;margin:4px 0 0;padding:4px 8px;background:var(--sk-surface,#f9f9f9);border:1px solid var(--sk-border,#e0e0e0);border-radius:var(--sk-radius);max-height:200px;overflow-y:auto}
.skp-ri{display:flex;align-items:baseline;gap:6px;padding:3px 0;font-size:.82rem;border-bottom:1px solid var(--sk-border,#e0e0e0)}
.skp-ri:last-child{border-bottom:none}
.skp-ri-id{font-family:monospace;font-size:.8rem;color:var(--sk-primary);white-space:nowrap}
.skp-ri-label{flex:1;color:var(--sk-text,#333);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skp-ri-badge{font-size:.72rem;padding:1px 5px;border-radius:3px;white-space:nowrap;text-transform:uppercase;letter-spacing:.03em}
.skp-ri-badge--wontfix{background:#e0e0e0;color:#555}
.skp-ri-badge--zurueck{background:#fef3c7;color:#92400e}