/* ============================================
   Administrace FitBreak — chrome admin.html
   Přesunuto z <style> bloku v admin.html
   (pravidlo projektu: žádné styly v HTML).
   ============================================ */
/* Map builder.css --admin-* tokens to FitBreak --color-* tokens */
:root {
    --admin-bg: var(--color-bg);
    --admin-bg-secondary: var(--color-bg-elevated, #161B22);
    --admin-surface: var(--color-bg-card);
    --admin-surface-hover: var(--color-bg-elevated, #1C2128);
    --admin-border: var(--color-border);
    --admin-border-light: var(--color-border-light);
    --admin-text: var(--color-text);
    --admin-text-secondary: var(--color-text-secondary);
    --admin-text-muted: var(--color-text-muted, #484F58);
    --admin-primary: var(--color-primary);
    --admin-success: var(--color-accent);
    --admin-warning: var(--color-warning);
    --admin-danger: var(--color-danger);
    --admin-radius: var(--radius-md, 8px);
    --admin-radius-sm: var(--radius-sm, 4px);
    --admin-transition: 0.15s ease;
}
.admin-page { max-width: none; margin: 0; padding: 0; }
.admin-section { margin-bottom: var(--space-2xl); }
/* Sidebar layout (.admin-layout/.admin-sidebar/.admin-nav…) je ve sdíleném css/admin-sidebar.css */
.admin-panel { display: none; }
.admin-panel.active { display: block; }
.setting-input-row { display: flex; align-items: center; gap: var(--space-md); padding: var(--space-md) 0; border-bottom: 1px solid var(--color-border-light); }
.setting-input-row:last-child { border-bottom: none; }
.setting-input-label { flex: 0 0 200px; font-weight: 600; font-size: 0.9rem; color: var(--color-text); }
.setting-input-field { flex: 1; }
.setting-input-field input, .setting-input-field select { width: 100%; padding: var(--space-sm) var(--space-md); background: var(--color-bg-input); border: 1px solid var(--color-border); border-radius: var(--radius-md); color: var(--color-text); font-family: var(--font-body); font-size: 0.9rem; }
.setting-input-field input:focus, .setting-input-field select:focus { outline: none; border-color: var(--color-primary); }
.stats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--space-md); margin-bottom: var(--space-xl); }
.user-table { width: 100%; border-collapse: collapse; }
.user-table th, .user-table td { padding: var(--space-sm) var(--space-md); text-align: left; border-bottom: 1px solid var(--color-border); font-size: 0.85rem; }
.user-table th { color: var(--color-text-muted); text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.5px; }
.user-table tr:hover td { background: var(--color-bg-elevated); }
.badge-paid { padding: 2px 8px; background: rgba(0,230,118,0.15); color: var(--color-accent); border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; }
/* Neutrální/„vypnutý" stav: zdarma s reklamou, nepublikováno, nedokončená platba.
   (Dřív `.badge-trial` — zkušební doba v produktu už neexistuje.) */
.badge-off { padding: 2px 8px; background: rgba(255,179,0,0.15); color: var(--color-warning); border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; }
.badge-admin { padding: 2px 8px; background: rgba(255,107,53,0.15); color: var(--color-primary); border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 700; }
#panelDocs .setting-input-field p { font-size: 0.9rem; line-height: 1.6; color: var(--color-text-secondary); }
#panelDocs .setting-input-field p strong { color: var(--color-text); }
#panelDocs .setting-input-field ul, #panelDocs .setting-input-field ol { margin: var(--space-sm) 0 var(--space-sm) var(--space-lg); color: var(--color-text-secondary); font-size: 0.85rem; line-height: 1.8; }
#panelDocs .setting-input-field li { margin-bottom: 2px; }
#panelDocs .setting-input-field code { background: var(--color-bg-input); border: 1px solid var(--color-border); padding: 1px 6px; border-radius: var(--radius-sm); font-size: 0.8rem; color: var(--color-primary-light); font-family: 'Consolas', 'Monaco', monospace; }
#panelDocs .setting-input-field a { color: var(--color-primary); text-decoration: none; }
#panelDocs .setting-input-field a:hover { text-decoration: underline; }
#panelDocs .setting-input-row { display: block; padding: var(--space-md); }

/* Builder form field styles (for BuilderAdmin-rendered forms) */
.builder-section-fields .form-group { margin-bottom: 1rem; }
.builder-section-fields .form-label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 0.375rem; text-transform: uppercase; letter-spacing: 0.03em; }
.builder-section-fields .form-input,
.builder-section-fields .form-textarea,
.builder-section-fields .form-select { width: 100%; padding: 0.5rem 0.75rem; background: var(--color-bg-input, #0D1117); border: 1px solid var(--color-border); border-radius: var(--radius-md, 8px); color: var(--color-text); font-family: var(--font-body, 'Inter', sans-serif); font-size: 0.875rem; transition: border-color 0.15s; }
.builder-section-fields .form-input:focus,
.builder-section-fields .form-textarea:focus,
.builder-section-fields .form-select:focus { outline: none; border-color: var(--color-primary); }
.builder-section-fields .form-textarea { resize: vertical; min-height: 60px; }
.builder-section-fields .form-select { cursor: pointer; }
.builder-section-fields .form-switch { display: inline-flex; align-items: center; cursor: pointer; position: relative; }
.builder-section-fields .form-switch-input { position: absolute; opacity: 0; width: 0; height: 0; }
.builder-section-fields .form-switch-slider { width: 40px; height: 22px; background: var(--color-border); border-radius: 11px; position: relative; transition: background 0.2s; }
.builder-section-fields .form-switch-slider::after { content: ''; position: absolute; width: 18px; height: 18px; border-radius: 50%; background: white; top: 2px; left: 2px; transition: transform 0.2s; }
.builder-section-fields .form-switch-input:checked + .form-switch-slider { background: var(--color-primary); }
.builder-section-fields .form-switch-input:checked + .form-switch-slider::after { transform: translateX(18px); }
.builder-section-fields .form-hint { font-size: 0.8rem; color: var(--color-text-muted); margin-top: 0.25rem; }

/* Builder admin button overrides */
.builder-section-fields .btn { cursor: pointer; }
.builder-section-fields .btn-sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
.builder-section-fields .btn-secondary { background: var(--color-bg-card); border: 1px solid var(--color-border); color: var(--color-text-secondary); border-radius: var(--radius-md, 8px); }
.builder-section-fields .btn-secondary:hover { border-color: var(--color-primary); color: var(--color-primary); }
.builder-section-fields .btn-outline-danger { background: none; border: 1px solid var(--color-danger); color: var(--color-danger); border-radius: var(--radius-md, 8px); }
.builder-section-fields .btn-outline-danger:hover { background: rgba(255,82,82,0.1); }

/* News Modal */
.news-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; }
.news-modal.visible { opacity: 1; pointer-events: auto; }
.news-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.6); }
.news-modal-content { position: relative; background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: 12px; padding: 28px; width: 90%; max-width: 640px; max-height: 85vh; overflow-y: auto; z-index: 1; }
.news-modal-close { position: absolute; top: 16px; right: 16px; background: none; border: none; color: var(--color-text-secondary); cursor: pointer; font-size: 1.4rem; line-height: 1; padding: 4px; transition: color 0.15s; }
.news-modal-close:hover { color: var(--color-text); }

/* Builder v2 — JS-side forms, lazy rendering */
.builder-section-card { border: 1px solid var(--color-border); border-radius: 8px; margin-bottom: 8px; background: var(--color-bg-card); }
.builder-section-card.is-hidden { opacity: 0.55; }
.builder-section-header { display: flex; align-items: center; gap: 8px; padding: 12px 16px; cursor: pointer; }
.builder-section-header:hover { background: var(--color-bg-elevated); border-radius: 8px; }
.builder-drag-handle { cursor: grab; color: var(--color-text-muted); font-size: 1.2rem; user-select: none; }
.builder-type-badge { font-size: 0.7rem; padding: 2px 8px; background: var(--color-primary); color: white; border-radius: 12px; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.builder-preview-text { flex: 1; color: var(--color-text-secondary); font-size: 0.85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.builder-section-actions { display: flex; align-items: center; gap: 4px; }
.builder-section-actions button { background: none; border: none; color: var(--color-text-muted); cursor: pointer; padding: 4px; border-radius: 4px; }
.builder-section-actions button:hover { color: var(--color-text); background: var(--color-bg-elevated); }
.builder-expand-chevron { transition: transform 0.2s; }
.builder-expand-chevron.expanded { transform: rotate(180deg); }
.builder-section-body { padding: 16px; border-top: 1px solid var(--color-border); }
.builder-section-body .form-group { margin-bottom: 12px; }
.builder-section-body .form-label { display: block; font-size: 0.8rem; color: var(--color-text-secondary); margin-bottom: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.builder-section-body .form-input { width: 100%; padding: 8px 12px; background: var(--color-bg-input); border: 1px solid var(--color-border); border-radius: 6px; color: var(--color-text); font-family: var(--font-body); font-size: 0.875rem; box-sizing: border-box; }
.builder-section-body .form-input:focus { outline: none; border-color: var(--color-primary); }
.builder-section-body textarea.form-input { resize: vertical; }
.builder-section-body .builder-code { font-family: 'Consolas', monospace; font-size: 0.85rem; }
.builder-type-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin: 16px 0; }
.builder-type-option { padding: 16px 12px; text-align: center; border: 1px solid var(--color-border); border-radius: 8px; cursor: pointer; background: var(--color-bg-card); transition: border-color 0.15s; }
.builder-type-option:hover { border-color: var(--color-primary); }
.builder-type-option-name { font-weight: 600; font-size: 0.85rem; margin-bottom: 2px; }
.builder-save-bar { display: flex; gap: 12px; align-items: center; justify-content: flex-end; margin-top: 16px; }
.repeater-container { border: 1px dashed var(--color-border); border-radius: 6px; padding: 12px; margin-top: 4px; }
.repeater-item { background: var(--color-bg-elevated); border-radius: 6px; padding: 12px; margin-bottom: 8px; position: relative; }
.repeater-item .form-group { margin-bottom: 8px; }
.repeater-remove-btn { position: absolute; top: 8px; right: 8px; background: none; border: none; color: var(--color-text-muted); cursor: pointer; font-size: 1.2rem; }
.repeater-remove-btn:hover { color: var(--color-danger, #f44); }
.repeater-add-btn { width: 100%; padding: 8px; background: none; border: 1px dashed var(--color-border); border-radius: 6px; color: var(--color-text-secondary); cursor: pointer; font-family: var(--font-body); }
.repeater-add-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.builder-empty { text-align: center; padding: 40px; color: var(--color-text-muted); }
.builder-dirty-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--color-warning); margin-right: 6px; }
.sortable-ghost { opacity: 0.4; }
.sortable-drag { box-shadow: 0 4px 16px rgba(0,0,0,0.3); }


/* ============================================
   Utility třídy administrace (prefix `a-`)
   --------------------------------------------
   Vznikly převodem 111 inline `style="…"` z admin.html — pravidlo projektu
   zakazuje styly v HTML. Jedna třída = jedna deklarace, názvy jsou odvozené
   strojově z původních hodnot (`a-<zkratka vlastnosti>-<hodnota>`).

   ⚠ Tohle NENÍ obecná utility knihovna k rozšiřování. Nový prvek admina má
   dostat vlastní pojmenovanou třídu (`.setting-input-row`, `.user-table` …);
   utility jsou tu jen proto, aby se dal převod udělat bez přepisu markupu.
   ============================================ */
.a-ai-center { align-items: center; }
.a-bd-none { border: none; }
.a-bd-thin { border: 1px solid var(--color-border); }
.a-bg-bdr { background: var(--color-border); }
.a-bg-card { background: var(--color-bg-card); }
.a-bg-dim { background: rgba(0,0,0,0.6); }
.a-bg-input { background: var(--color-bg-input); }
.a-bg-pri { background: var(--color-primary); }
.a-bg-transp { background: transparent; }
.a-bottom-0 { bottom: 0; }
.a-c-dng { color: var(--color-danger); }
.a-c-mut { color: var(--color-text-muted); }
.a-c-sec { color: var(--color-text-secondary); }
.a-c-txt { color: var(--color-text); }
.a-c-white { color: #fff; }
.a-cur-pointer { cursor: pointer; }
.a-d-block { display: block; }
.a-d-flex { display: flex; }
.a-d-inline-flex { display: inline-flex; }
.a-fd-column { flex-direction: column; }
.a-ff-body { font-family: var(--font-body); }
.a-ff-mono { font-family: 'Consolas',monospace; }
.a-fl-1 { flex: 1; }
.a-fs-075rem { font-size: 0.75rem; }
.a-fs-07rem { font-size: 0.7rem; }
.a-fs-085rem { font-size: 0.85rem; }
.a-fs-08rem { font-size: 0.8rem; }
.a-fs-09rem { font-size: 0.9rem; }
.a-fw-600 { font-weight: 600; }
.a-g-12px { gap: 12px; }
.a-g-6px { gap: 6px; }
.a-g-8px { gap: 8px; }
.a-g-sm { gap: var(--space-sm); }
.a-g-xs { gap: var(--space-xs); }
.a-h-1px { height: 1px; }
.a-jc-between { justify-content: space-between; }
.a-jc-center { justify-content: center; }
.a-jc-end { justify-content: flex-end; }
.a-left-0 { left: 0; }
.a-lh-16 { line-height: 1.6; }
.a-m-0 { margin: 0; }
.a-m-auto80 { margin: 80px auto; }
.a-m-v20 { margin: 20px 0; }
.a-maxh-120px { max-height: 120px; }
.a-maxh-300px { max-height: 300px; }
.a-maxh-80vh { max-height: 80vh; }
.a-maxw-200px { max-width: 200px; }
.a-maxw-300px { max-width: 300px; }
.a-maxw-400px { max-width: 400px; }
.a-maxw-600px { max-width: 600px; }
.a-mb-0 { margin-bottom: 0; }
.a-mb-12px { margin-bottom: 12px; }
.a-mb-16px { margin-bottom: 16px; }
.a-mb-20px { margin-bottom: 20px; }
.a-mb-24px { margin-bottom: 24px; }
.a-mb-4px { margin-bottom: 4px; }
.a-mb-8px { margin-bottom: 8px; }
.a-mb-md { margin-bottom: var(--space-md); }
.a-ml-6px { margin-left: 6px; }
.a-mr-4px { margin-right: 4px; }
.a-mt-12px { margin-top: 12px; }
.a-mt-16px { margin-top: 16px; }
.a-mt-20px { margin-top: 20px; }
.a-mt-24px { margin-top: 24px; }
.a-mt-4px { margin-top: 4px; }
.a-mt-8px { margin-top: 8px; }
.a-mt-lg { margin-top: var(--space-lg); }
.a-mt-md { margin-top: var(--space-md); }
.a-ovy-auto { overflow-y: auto; }
.a-p-12px { padding: 12px; }
.a-p-40px { padding: 40px; }
.a-p-6-16 { padding: 6px 16px; }
.a-p-8-12 { padding: 8px 12px; }
.a-p-8-20 { padding: 8px 20px; }
.a-p-xl { padding: var(--space-xl); }
.a-pos-absolute { position: absolute; }
.a-pos-fixed { position: fixed; }
.a-pos-relative { position: relative; }
.a-r-8px { border-radius: 8px; }
.a-r-var-radius-lg { border-radius: var(--radius-lg); }
.a-r-var-radius-sm { border-radius: var(--radius-sm); }
.a-right-0 { right: 0; }
.a-rz-vertical { resize: vertical; }
.a-ta-center { text-align: center; }
.a-ta-left { text-align: left; }
.a-td-none { text-decoration: none; }
.a-top-0 { top: 0; }
.a-w-100p { width: 100%; }
.a-w-90p { width: 90%; }
.a-z-950 { z-index: 950; }

/* Naplánovaný článek — publikovaný, ale jeho datum ještě nenastalo.
   Musí se poznat od vydaného, jinak ho správce marně hledá na webu. */
.badge-planned {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(255, 183, 77, 0.16);
    color: #FFB74D;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}