/* ═══════════════════════════════════════════════
   Plughead-AGs Public Styles
   Theme-aware: inherits fonts & colors from WP theme
   ═══════════════════════════════════════════════ */

/* CSS Variables — adapt to any theme via inherit + sensible fallbacks */
:root {
    --pags-accent: var(--wp--preset--color--primary, var(--e-global-color-primary, #4a6cf7));
    --pags-accent-hover: color-mix(in srgb, var(--pags-accent) 85%, #000);
    --pags-bg: var(--wp--preset--color--base, #fff);
    --pags-text: var(--wp--preset--color--contrast, inherit);
    --pags-text-muted: color-mix(in srgb, var(--pags-text) 60%, transparent);
    --pags-border: color-mix(in srgb, var(--pags-text) 15%, transparent);
    --pags-surface: color-mix(in srgb, var(--pags-text) 4%, var(--pags-bg));
    --pags-success: #16a34a;
    --pags-danger: #dc2626;
    --pags-warning: #ca8a04;
    --pags-radius: 10px;
}

/* Base card */
.pags-public-card {
    background: var(--pags-bg); border: 1px solid var(--pags-border);
    border-radius: var(--pags-radius); padding: 24px; margin: 16px 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    color: var(--pags-text); font-family: inherit;
}
.pags-public-card h2 { margin-top: 0; color: inherit; }
.pags-pub-warn { border-left: 4px solid var(--pags-warning); }

/* Status badges */
.pags-pub-status-badge {
    display: inline-block; padding: 6px 16px; border-radius: 20px;
    font-weight: 600; font-size: 0.85em; margin: 8px 0;
}
.pags-pub-prep .pags-pub-status-badge    { background: var(--pags-surface); color: var(--pags-text-muted); }
.pags-pub-active .pags-pub-status-badge  { background: #dcfce7; color: #166534; }
.pags-pub-ended .pags-pub-status-badge   { background: #fef9c3; color: #854d0e; }
.pags-pub-final .pags-pub-status-badge   { background: #fee2e2; color: #991b1b; }
.pags-pub-deadline { color: var(--pags-text-muted); font-size: 0.875em; }
.pags-pub-badge { font-size: 0.75em; }
.pags-pub-badge-info { background: #e0f2fe; color: #0369a1; padding: 2px 8px; border-radius: 10px; }

/* Wahl container */
.pags-wahl-container { font-family: inherit; color: var(--pags-text); }
.pags-wahl-header {
    background: var(--pags-accent); color: #fff;
    border-radius: var(--pags-radius); padding: 24px; margin-bottom: 20px;
}
.pags-wahl-header h2 { color: #fff; margin-top: 0; }
.pags-wahl-header p { opacity: 0.9; }
.pags-wahl-counter {
    display: inline-block; background: rgba(255,255,255,0.2); padding: 8px 16px;
    border-radius: 20px; font-weight: 600; font-size: 1em;
}

/* Filter Toolbar */
.pags-filter-toolbar {
    background: var(--pags-surface); border: 1px solid var(--pags-border);
    border-radius: var(--pags-radius); padding: 14px 18px; margin-bottom: 16px;
    display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
}
.pags-filter-group {
    display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.pags-filter-label {
    font-weight: 600; font-size: 0.9em; margin-right: 4px;
    color: var(--pags-text);
}
.pags-filter-btn {
    background: var(--pags-bg); border: 1px solid var(--pags-border);
    border-radius: 18px; padding: 5px 14px; font-size: 0.85em;
    cursor: pointer; transition: all 0.15s; color: var(--pags-text);
    font-family: inherit; line-height: 1.4;
}
.pags-filter-btn:hover {
    border-color: var(--pags-accent); color: var(--pags-accent);
}
.pags-filter-btn.pags-filter-active {
    background: var(--pags-accent); color: #fff;
    border-color: var(--pags-accent);
}
.pags-filter-toggle {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 0.9em; cursor: pointer; color: var(--pags-text);
    user-select: none;
}
.pags-filter-toggle input[type="checkbox"] {
    width: 16px; height: 16px; accent-color: var(--pags-accent);
    cursor: pointer;
}
.pags-filter-empty {
    grid-column: 1 / -1; text-align: center; padding: 32px 16px;
    color: var(--pags-text-muted); font-style: italic; font-size: 0.95em;
}

/* AG Cards Grid */
.pags-ag-cards {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
}

.pags-vote-card {
    background: var(--pags-bg); border: 2px solid var(--pags-border);
    border-radius: var(--pags-radius); padding: 20px; transition: all 0.2s;
    cursor: default; color: var(--pags-text);
}
.pags-vote-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.pags-vote-selected { border-color: var(--pags-accent); background: color-mix(in srgb, var(--pags-accent) 6%, var(--pags-bg)); }
.pags-vote-ineligible { opacity: 0.5; }
.pags-vote-full { opacity: 0.65; }

.pags-vote-card-head { display: flex; justify-content: space-between; align-items: center; }
.pags-vote-card-head h3 { margin: 0 0 8px 0; font-size: 1.05em; color: inherit; }
.pags-vote-check {
    width: 28px; height: 28px; border-radius: 50%; background: var(--pags-accent);
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-weight: bold; font-size: 1em; flex-shrink: 0;
}

.pags-vote-meta { font-size: 0.82em; color: var(--pags-text-muted); margin-bottom: 4px; }
.pags-vote-desc {
    font-size: 0.82em; color: var(--pags-text); opacity: 0.85;
    margin: 10px 0; max-height: 80px; overflow: hidden; position: relative;
}
.pags-vote-capacity { margin: 10px 0 12px; font-size: 0.82em; }
.pags-pub-progress { background: var(--pags-border); border-radius: 4px; height: 6px; margin-top: 4px; overflow: hidden; }
.pags-pub-progress-bar { height: 100%; border-radius: 4px; transition: width 0.3s; }

.pags-vote-btn {
    display: block; width: 100%; padding: 10px; border: none;
    border-radius: calc(var(--pags-radius) - 2px);
    font-size: 0.875em; font-weight: 600; cursor: pointer; transition: all 0.2s;
    font-family: inherit;
}
.pags-vote-btn-add { background: var(--pags-accent); color: #fff; }
.pags-vote-btn-add:hover { background: var(--pags-accent-hover); }
.pags-vote-btn-remove { background: #fee2e2; color: #991b1b; }
.pags-vote-btn-remove:hover { background: #fecaca; }
.pags-vote-reason { text-align: center; font-size: 0.82em; color: var(--pags-text-muted); padding: 8px; }

/* My votes list */
.pags-pub-my-votes { list-style: none; padding: 0; }
.pags-pub-my-votes li {
    padding: 8px 16px; background: var(--pags-surface);
    border: 1px solid var(--pags-border);
    border-radius: calc(var(--pags-radius) - 4px);
    margin-bottom: 6px; font-weight: 500;
}

/* ═══════════════════════════════════════════════
   Veranstalter Area
   ═══════════════════════════════════════════════ */
.pags-veranstalter-container { font-family: inherit; color: var(--pags-text); }
.pags-v-projekt-select {
    background: var(--pags-surface); border: 1px solid var(--pags-border);
    border-radius: calc(var(--pags-radius) - 2px);
    padding: 12px 16px; margin-bottom: 16px; display: flex; align-items: center; gap: 10px;
}
.pags-v-projekt-select label { font-weight: 600; font-size: 0.875em; white-space: nowrap; }
.pags-v-projekt-select select {
    padding: 6px 12px; border: 1px solid var(--pags-border); border-radius: 6px;
    font-size: 0.875em; cursor: pointer; flex: 1; max-width: 400px; font-family: inherit;
}
.pags-v-project-name { margin-top: 0; color: inherit; }
.pags-v-ag-block {
    background: var(--pags-bg); border: 1px solid var(--pags-border);
    border-radius: var(--pags-radius); padding: 20px; margin-bottom: 16px;
}
.pags-v-ag-block h3 { margin-top: 0; color: inherit; }
.pags-v-count { font-weight: normal; color: var(--pags-text-muted); }
.pags-v-table { width: 100%; border-collapse: collapse; font-size: 0.875em; }
.pags-v-table th, .pags-v-table td {
    padding: 8px 12px; border-bottom: 1px solid var(--pags-border); text-align: left;
}
.pags-v-table th { font-weight: 600; background: var(--pags-surface); }
.pags-v-remove-tn {
    background: none; border: none; color: var(--pags-danger); cursor: pointer;
    font-size: 1em; font-weight: bold;
}
.pags-v-empty { color: var(--pags-text-muted); font-style: italic; }

/* Veranstalter AG Header with actions */
.pags-v-ag-header {
    display: flex; justify-content: space-between; align-items: flex-start;
    flex-wrap: wrap; gap: 8px; margin-bottom: 8px;
}
.pags-v-ag-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }

/* Veranstalter Action Buttons */
.pags-v-btn {
    display: inline-block; padding: 4px 12px; border: 1px solid var(--pags-border);
    border-radius: 6px; font-size: 0.75em; cursor: pointer;
    background: var(--pags-surface); color: var(--pags-text); transition: all 0.2s;
    font-family: inherit;
}
.pags-v-btn:hover { background: var(--pags-border); }
.pags-v-btn-confirm { background: #dcfce7; color: #166534; border-color: #86efac; }
.pags-v-btn-confirm:hover { background: #bbf7d0; }
.pags-v-btn-danger { background: var(--pags-bg); color: var(--pags-danger); border-color: #fca5a5; }
.pags-v-btn-danger:hover { background: #fee2e2; }

/* Veranstalter AG Details */
.pags-v-ag-details {
    display: flex; gap: 16px; flex-wrap: wrap;
    font-size: 0.82em; color: var(--pags-text-muted); margin-bottom: 10px;
}
.pags-v-ag-desc {
    font-size: 0.82em; color: var(--pags-text); opacity: 0.85;
    margin-bottom: 12px; padding: 10px;
    background: var(--pags-surface); border-radius: 6px;
    max-height: 100px; overflow-y: auto;
}

/* ═══════════════════════════════════════════════
   AG Create/Edit Form
   ═══════════════════════════════════════════════ */
.pags-v-ag-form-card {
    background: var(--pags-surface); border: 2px solid var(--pags-border);
    border-radius: var(--pags-radius); padding: 24px; margin-bottom: 20px;
}
.pags-v-ag-form-card h3 { margin-top: 0; color: inherit; }

.pags-v-form-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px; margin-bottom: 12px;
}
.pags-v-field label {
    display: block; font-size: 0.75em; font-weight: 600;
    color: var(--pags-text-muted); margin-bottom: 4px;
}
.pags-v-field input, .pags-v-field textarea, .pags-v-field select {
    width: 100%; padding: 8px 12px; border: 1px solid var(--pags-border);
    border-radius: 6px; font-size: 0.875em; box-sizing: border-box;
    font-family: inherit; background: var(--pags-bg); color: var(--pags-text);
}
.pags-v-field input:focus, .pags-v-field textarea:focus {
    outline: none; border-color: var(--pags-accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--pags-accent) 25%, transparent);
}
.pags-v-field-full { margin-bottom: 12px; }

.pags-v-checkbox-label {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.875em !important; font-weight: 500 !important;
    color: var(--pags-text) !important; cursor: pointer;
}
.pags-v-checkbox-label input[type="checkbox"] {
    width: auto; margin: 0; accent-color: var(--pags-accent);
}
.pags-v-checkbox-label small { color: var(--pags-text-muted); }

.pags-v-form-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.pags-v-btn-save {
    display: inline-block; padding: 10px 24px; border: none;
    border-radius: calc(var(--pags-radius) - 2px);
    background: var(--pags-accent); color: #fff;
    font-size: 0.875em; font-weight: 600;
    cursor: pointer; transition: background 0.2s; font-family: inherit;
}
.pags-v-btn-save:hover { background: var(--pags-accent-hover); }
.pags-v-btn-save:disabled { opacity: 0.6; cursor: not-allowed; }

.pags-v-notice {
    margin-top: 12px; padding: 10px 16px;
    border-radius: 6px; font-size: 0.875em;
}