/**
 * OLAMI Master Manager — SEC Announcements Styles
 * File: assets/css/sec-announcements.css
 * Extracted from sec.css in Phase 20C (v428)
 *
 * Contains: Announcement bar, themes, modals, animations (13 blocks from sec-announcements.php)
 */

/* === INLINE STYLES FROM sec-inline.css === */
/**
 * Extracted Inline Styles → temp/sec-inline.css
 * Generated: 2026-02-07 20:48
 * Blocks: 13
 */


/* Source: includes/sec-announcements.php line 567 (block 1/13) */
.olami-announcements-container {
        position: relative;
        z-index: 100;
        margin-bottom: 10px;
    }
    
    .olami-announcement {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 16px;
        border-radius: 10px;
        margin-bottom: 6px;
        font-size: 13px;
        font-weight: 500;
        animation: annSlideDown 0.4s ease-out;
        transition: all 0.3s ease;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }
    
    @keyframes annSlideDown {
        from {
            opacity: 0;
            transform: translateY(-20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    .olami-announcement.hiding {
        opacity: 0;
        transform: translateY(-10px);
        margin-bottom: 0;
        padding: 0 16px;
        height: 0;
        overflow: hidden;
    }
    
    /* Theme: Info (Blue) */
    .ann-theme-info {
        background: linear-gradient(135deg, var(--info-bg) 0%, var(--info-bg) 100%);
        border: 1px solid var(--info);
        color: var(--info-text);
    }
    .ann-theme-info .ann-cta {
        background: var(--info);
        color: var(--text-inverse);
    }
    .ann-theme-info .ann-cta:hover {
        background: var(--info-text);
    }
    
    /* Theme: Success (Green) */
    .ann-theme-success {
        background: linear-gradient(135deg, var(--success-bg) 0%, var(--success-bg) 100%);
        border: 1px solid var(--success);
        color: var(--success-text);
    }
    .ann-theme-success .ann-cta {
        background: var(--success);
        color: var(--text-inverse);
    }
    .ann-theme-success .ann-cta:hover {
        background: var(--success-text);
    }
    
    /* Theme: Urgent (Orange) */
    .ann-theme-urgent {
        background: linear-gradient(135deg, var(--warning-bg) 0%, var(--warning-bg) 100%);
        border: 1px solid var(--warning);
        color: var(--warning-text);
    }
    .ann-theme-urgent .ann-cta {
        background: var(--coin);
        color: var(--text-inverse);
    }
    .ann-theme-urgent .ann-cta:hover {
        background: var(--warning);
    }
    
    /* Theme: Critical (Red) */
    .ann-theme-critical {
        background: linear-gradient(135deg, var(--danger-bg) 0%, var(--danger-bg) 100%);
        border: 1px solid var(--danger);
        color: var(--danger-text);
    }
    .ann-theme-critical .ann-cta {
        background: var(--danger);
        color: var(--text-inverse);
    }
    .ann-theme-critical .ann-cta:hover {
        background: var(--danger);
    }
    
    .ann-content {
        display: flex;
        align-items: center;
        gap: 10px;
        flex: 1;
        min-width: 0;
    }
    
    .ann-icon {
        font-size: 16px;
        flex-shrink: 0;
    }
    
    .ann-message {
        flex: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .ann-cta {
        flex-shrink: 0;
        padding: 5px 12px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.2s;
        white-space: nowrap;
    }
    
    .ann-dismiss-wrap {
        flex-shrink: 0;
        margin-left: 10px;
        display: flex;
        align-items: center;
    }
    
    .ann-dismiss-wrap .ann-dismiss {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
        border: none !important;
        background: rgba(0,0,0,0.1) !important;
        border-radius: 50% !important;
        cursor: pointer;
        font-size: 16px !important;
        line-height: 1 !important;
        color: inherit !important;
        opacity: 0.6;
        transition: all 0.2s;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-shadow: none !important;
    }
    
    .ann-dismiss-wrap .ann-dismiss:hover {
        opacity: 1;
        background: rgba(0,0,0,0.2) !important;
    }
    
    /* Mobile optimization */
    @media (max-width: 600px) {
        .olami-announcement {
            padding: 8px 12px;
            font-size: 12px;
            border-radius: 8px;
        }
        .ann-content {
            gap: 6px;
        }
        .ann-icon {
            font-size: 14px;
        }
        .ann-cta {
            padding: 4px 10px;
            font-size: 11px;
        }
        .ann-dismiss-wrap {
            margin-left: 6px;
        }
        .ann-dismiss-wrap .ann-dismiss {
            width: 22px !important;
            height: 22px !important;
            min-width: 22px !important;
            font-size: 14px !important;
        }
    }


/* Source: includes/sec-announcements.php line 999 (block 2/13) */
.ann-list {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
        gap: 16px;
    }
    .ann-card {
        background: var(--surface);
        border: 1px solid var(--border);
        border-radius: 12px;
        overflow: hidden;
        transition: all 0.2s;
    }
    .ann-card:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        border-color: var(--border);
    }
    .ann-card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px;
        background: var(--bg);
        border-bottom: 1px solid var(--border);
    }
    .ann-card-status {
        font-size: 10px;
        font-weight: 700;
        color: var(--text-inverse);
        padding: 3px 8px;
        border-radius: 4px;
    }
    .ann-card-theme {
        font-size: 12px;
        color: var(--text-secondary);
    }
    .ann-card-body {
        padding: 16px;
    }
    .ann-card-message {
        font-size: 15px;
        font-weight: 600;
        color: var(--text);
        line-height: 1.4;
        margin-bottom: 8px;
    }
    .ann-card-cta {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 10px;
    }
    .ann-cta-preview {
        background: var(--primary);
        color: var(--text-inverse);
        padding: 4px 10px;
        border-radius: 5px;
        font-size: 11px;
        font-weight: 600;
    }
    .ann-cta-url {
        font-size: 11px;
        color: var(--text-secondary);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .ann-card-stats {
        display: flex;
        gap: 20px;
        padding: 12px 16px;
        background: var(--bg);
        border-top: 1px solid var(--border);
    }
    .ann-stat {
        text-align: center;
        cursor: pointer;
        padding: 4px 8px;
        border-radius: 6px;
        transition: background 0.2s;
    }
    .ann-stat:hover {
        background: var(--border);
    }
    .ann-stat-num {
        display: block;
        font-size: 18px;
        font-weight: 700;
        color: var(--text);
    }
    .ann-stat-label {
        font-size: 10px;
        color: var(--text-secondary);
        text-transform: uppercase;
    }
    .ann-card-meta {
        display: flex;
        gap: 12px;
        padding: 8px 16px;
        font-size: 11px;
        color: var(--text-secondary);
        border-top: 1px solid var(--border-light);
    }
    .ann-card-actions {
        display: flex;
        gap: 8px;
        padding: 12px 16px;
        border-top: 1px solid var(--border);
    }
    .ann-action-btn {
        flex: 1;
        padding: 8px;
        border: 1px solid var(--border);
        border-radius: 6px;
        background: var(--surface);
        font-size: 12px;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        color: var(--text-secondary);
        transition: all 0.2s;
    }
    .ann-action-btn:hover {
        background: var(--bg);
        border-color: var(--border);
    }
    .ann-action-btn.activate { color: var(--success); }
    .ann-action-btn.pause { color: var(--warning); }
    .ann-action-btn.delete { color: var(--danger); }
    .ann-action-btn.delete:hover { background: var(--danger-bg); }

    /* Stats Modal */
    .ann-stat-modal {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 99999;
        align-items: center;
        justify-content: center;
        padding: 20px;
    }
    .ann-stat-modal.show { display: flex; }
    .ann-stat-modal-content {
        background: var(--surface);
        border-radius: 12px;
        width: 100%;
        max-width: 500px;
        max-height: 80vh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    .ann-stat-modal-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        background: var(--bg);
        border-bottom: 1px solid var(--border);
    }
    .ann-stat-modal-header h3 { margin: 0; font-size: 16px; }
    .ann-stat-modal-close {
        width: 30px;
        height: 30px;
        border: none;
        background: var(--border);
        border-radius: 50%;
        cursor: pointer;
        font-size: 18px;
        color: var(--text-secondary);
    }
    .ann-stat-modal-body {
        padding: 20px;
        overflow-y: auto;
        flex: 1;
    }
    .ann-stat-list { list-style: none; padding: 0; margin: 0; }
    .ann-stat-list li {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 12px;
        background: var(--bg);
        border-radius: 8px;
        margin-bottom: 8px;
        font-size: 13px;
    }
    .ann-stat-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: var(--primary);
        color: var(--text-inverse);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 14px;
    }
    .ann-stat-info { flex: 1; }
    .ann-stat-name { font-weight: 600; color: var(--text); }
    .ann-stat-email { font-size: 11px; color: var(--text-secondary); }
    .ann-stat-time { font-size: 11px; color: var(--text-secondary); }
    .ann-stat-empty { text-align: center; padding: 30px; color: var(--text-secondary); }


/* Source: includes/sec-announcements.php line 1465 (block 3/13) */
.ann-form-grid {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 24px;
    }
    .ann-form-main, .ann-form-sidebar {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .ann-form-section {
        background: var(--surface);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 20px;
    }
    .ann-form-section h3 {
        margin: 0 0 16px;
        font-size: 14px;
        font-weight: 700;
        color: var(--text);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .ann-field {
        margin-bottom: 16px;
    }
    .ann-field:last-child {
        margin-bottom: 0;
    }
    .ann-field label {
        display: block;
        font-size: 13px;
        font-weight: 600;
        color: var(--text-secondary);
        margin-bottom: 6px;
    }
    .ann-field input[type="text"],
    .ann-field input[type="url"],
    .ann-field input[type="date"],
    .ann-select {
        width: 100%;
        padding: 10px 12px;
        border: 1px solid var(--border);
        border-radius: 8px;
        font-size: 14px;
        transition: border-color 0.2s;
    }
    .ann-field input:focus,
    .ann-select:focus {
        outline: none;
        border-color: var(--primary);
    }
    .field-hint {
        display: block;
        font-size: 11px;
        color: var(--text-secondary);
        margin-top: 4px;
    }
    .ann-field-row {
        display: flex;
        gap: 12px;
    }
    .ann-field-row .ann-field {
        flex: 1;
    }
    .required {
        color: var(--danger);
    }
    .ann-theme-picker {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
    }
    .theme-option {
        cursor: pointer;
    }
    .theme-option input {
        display: none;
    }
    .theme-preview {
        display: inline-block;
        padding: 8px 14px;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 600;
        border: 2px solid transparent;
        transition: all 0.2s;
    }
    .theme-preview.info { background: var(--info-bg); color: var(--info-text); }
    .theme-preview.success { background: var(--success-bg); color: var(--success-text); }
    .theme-preview.urgent { background: var(--warning-bg); color: var(--warning-text); }
    .theme-preview.critical { background: var(--danger-bg); color: var(--danger-text); }
    .theme-option input:checked + .theme-preview {
        border-color: currentColor;
        box-shadow: 0 0 0 2px currentColor;
    }
    .ann-checkbox {
        display: flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
    }
    .ann-checkbox input {
        width: 18px;
        height: 18px;
    }
    .ann-submit-btn {
        width: 100%;
        padding: 14px;
        border: none;
        border-radius: 10px;
        color: var(--text-inverse);
        font-size: 15px;
        font-weight: 700;
        cursor: pointer;
        transition: all 0.2s;
    }
    .ann-submit-btn:hover {
        opacity: 0.9;
        transform: translateY(-1px);
    }
    
    /* Live Preview */
    .ann-live-preview {
        background: var(--bg);
        border-radius: 10px;
        padding: 16px;
    }
    .preview-bar {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 14px;
        border-radius: 8px;
        font-size: 13px;
        font-weight: 500;
        background: linear-gradient(135deg, var(--info-bg) 0%, var(--info-bg) 100%);
        border: 1px solid var(--info);
        color: var(--info-text);
    }
    .preview-bar.success {
        background: linear-gradient(135deg, var(--success-bg) 0%, var(--success-bg) 100%);
        border-color: var(--success);
        color: var(--success-text);
    }
    .preview-bar.urgent {
        background: linear-gradient(135deg, var(--warning-bg) 0%, var(--warning-bg) 100%);
        border-color: var(--warning);
        color: var(--warning-text);
    }
    .preview-bar.critical {
        background: linear-gradient(135deg, var(--danger-bg) 0%, var(--danger-bg) 100%);
        border-color: var(--danger);
        color: var(--danger-text);
    }
    .preview-message {
        flex: 1;
    }
    .preview-cta {
        background: var(--info);
        color: var(--text-inverse);
        padding: 4px 10px;
        border-radius: 5px;
        font-size: 11px;
        font-weight: 600;
    }
    .preview-bar.success .preview-cta { background: var(--success); }
    .preview-bar.urgent .preview-cta { background: var(--coin); }
    .preview-bar.critical .preview-cta { background: var(--danger); }
    .preview-dismiss {
        opacity: 0.6;
        font-size: 16px;
    }
    
    @media (max-width: 900px) {
        .ann-form-grid {
            grid-template-columns: 1fr;
        }
    }


/* Source: includes/sec-announcements.php line 1705 (block 4/13) */
.sec-frontend-hub {
                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            }
            .sec-fe-header {
                background: linear-gradient(135deg, var(--primary), #6366f1); /* intentional */
                color: var(--text-inverse);
                padding: 20px;
                border-radius: 12px 12px 0 0;
            }
            .sec-fe-header h2 {
                margin: 0;
                font-size: 20px;
                font-weight: 700;
            }
            .sec-fe-header p {
                margin: 5px 0 0;
                opacity: 0.9;
                font-size: 13px;
            }
            .sec-fe-tabs {
                display: flex;
                background: var(--bg);
                border-bottom: 1px solid var(--border);
                overflow-x: auto;
            }
            .sec-fe-tab {
                padding: 14px 20px;
                font-size: 13px;
                font-weight: 600;
                color: var(--text-secondary);
                text-decoration: none;
                border-bottom: 3px solid transparent;
                white-space: nowrap;
                transition: all 0.2s;
            }
            .sec-fe-tab:hover {
                color: var(--text);
                background: var(--surface);
            }
            .sec-fe-tab.active {
                color: var(--primary);
                border-bottom-color: var(--primary);
                background: var(--surface);
            }
            .sec-fe-content {
                background: var(--surface);
                padding: 20px;
                border-radius: 0 0 12px 12px;
                border: 1px solid var(--border);
                border-top: none;
            }
            
            /* Mobile */
            @media (max-width: 600px) {
                .sec-fe-header {
                    padding: 15px;
                }
                .sec-fe-header h2 {
                    font-size: 18px;
                }
                .sec-fe-tab {
                    padding: 12px 14px;
                    font-size: 12px;
                }
                .sec-fe-content {
                    padding: 12px;
                }
            }


/* Source: includes/sec-announcements.php line 1893 (block 5/13) */
.sec-notice { padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; font-size: 14px; }
    .sec-notice.success { background: var(--success-bg); color: var(--success-text); }
    .sec-fe-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
    .sec-fe-header h3 { margin: 0; font-size: 18px; }
    .sec-fe-header p { margin: 5px 0 0; color: var(--text-secondary); font-size: 13px; }
    .sec-btn-new { display: inline-block; padding: 10px 18px; background: var(--primary); color: var(--text-inverse); border-radius: 8px; text-decoration: none; font-weight: 600; font-size: 13px; }
    
    /* Card Grid Layout - Matching Backend */
    .ann-list {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 16px;
    }
    .ann-card {
        background: var(--surface);
        border: 1px solid var(--border);
        border-radius: 12px;
        overflow: hidden;
        transition: all 0.2s;
    }
    .ann-card:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        border-color: var(--border);
    }
    .ann-card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px;
        background: var(--bg);
        border-bottom: 1px solid var(--border);
    }
    .ann-card-status {
        font-size: 10px;
        font-weight: 700;
        color: var(--text-inverse);
        padding: 3px 8px;
        border-radius: 4px;
    }
    .ann-card-theme {
        font-size: 12px;
        color: var(--text-secondary);
    }
    .ann-card-body {
        padding: 16px;
    }
    .ann-card-message {
        font-size: 15px;
        font-weight: 600;
        color: var(--text);
        line-height: 1.4;
        margin-bottom: 8px;
    }
    .ann-card-cta {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 10px;
    }
    .ann-cta-preview {
        background: var(--primary);
        color: var(--text-inverse);
        padding: 4px 10px;
        border-radius: 5px;
        font-size: 11px;
        font-weight: 600;
    }
    .ann-cta-url {
        font-size: 11px;
        color: var(--text-secondary);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 180px;
    }
    .ann-card-stats {
        display: flex;
        justify-content: space-around;
        padding: 12px 16px;
        background: var(--bg);
        border-top: 1px solid var(--border);
    }
    .ann-stat {
        text-align: center;
        cursor: pointer;
        padding: 4px 8px;
        border-radius: 6px;
        transition: background 0.2s;
    }
    .ann-stat:hover {
        background: var(--border);
    }
    .ann-stat-num {
        display: block;
        font-size: 18px;
        font-weight: 700;
        color: var(--text);
    }
    .ann-stat-label {
        font-size: 10px;
        color: var(--text-secondary);
        text-transform: uppercase;
    }
    .ann-card-meta {
        display: flex;
        gap: 12px;
        padding: 8px 16px;
        font-size: 11px;
        color: var(--text-secondary);
        border-top: 1px solid var(--border-light);
        flex-wrap: wrap;
    }
    .ann-card-actions {
        display: flex;
        gap: 8px;
        padding: 12px 16px;
        border-top: 1px solid var(--border);
    }
    .ann-card-actions .btn-wrap {
        flex: 1;
        display: flex;
    }
    .ann-card-actions .btn-wrap a,
    .ann-card-actions .btn-wrap button {
        flex: 1;
        padding: 8px !important;
        border: 1px solid var(--border) !important;
        border-radius: 6px !important;
        background: var(--surface) !important;
        font-size: 12px !important;
        cursor: pointer;
        text-align: center;
        text-decoration: none !important;
        color: var(--text-secondary) !important;
        transition: all 0.2s;
        box-shadow: none !important;
        line-height: 1.4 !important;
        margin: 0 !important;
    }
    .ann-card-actions .btn-wrap a:hover,
    .ann-card-actions .btn-wrap button:hover {
        background: var(--bg) !important;
        border-color: var(--border) !important;
    }
    .ann-card-actions .btn-wrap .activate { color: var(--success) !important; }
    .ann-card-actions .btn-wrap .pause { color: var(--warning) !important; }
    .ann-card-actions .btn-wrap .delete { color: var(--danger) !important; }
    .ann-card-actions .btn-wrap .delete:hover { background: var(--danger-bg) !important; }
    .ann-action-btn {
        flex: 1;
        padding: 8px;
        border: 1px solid var(--border);
        border-radius: 6px;
        background: var(--surface);
        font-size: 12px;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        color: var(--text-secondary);
        transition: all 0.2s;
    }
    .ann-action-btn:hover {
        background: var(--bg);
        border-color: var(--border);
    }
    .ann-action-btn.activate { color: var(--success); }
    .ann-action-btn.pause { color: var(--warning); }
    .ann-action-btn.delete { color: var(--danger); }
    .ann-action-btn.delete:hover { background: var(--danger-bg); }

    /* Stats Modal */
    .sec-stat-modal {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 99999;
        align-items: center;
        justify-content: center;
        padding: 20px;
    }
    .sec-stat-modal.show { display: flex; }
    .sec-stat-modal-content {
        background: var(--surface);
        border-radius: 12px;
        width: 100%;
        max-width: 500px;
        max-height: 80vh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    .sec-stat-modal-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        background: var(--bg);
        border-bottom: 1px solid var(--border);
    }
    .sec-stat-modal-header h3 { margin: 0; font-size: 16px; }
    .sec-stat-modal-close {
        width: 30px;
        height: 30px;
        border: none;
        background: var(--border);
        border-radius: 50%;
        cursor: pointer;
        font-size: 18px;
        color: var(--text-secondary);
    }
    .sec-stat-modal-body {
        padding: 20px;
        overflow-y: auto;
        flex: 1;
    }
    .sec-stat-list { list-style: none; padding: 0; margin: 0; }
    .sec-stat-list li {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 12px;
        background: var(--bg);
        border-radius: 8px;
        margin-bottom: 8px;
        font-size: 13px;
    }
    .sec-stat-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: var(--primary);
        color: var(--text-inverse);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 14px;
    }
    .sec-stat-info { flex: 1; }
    .sec-stat-name { font-weight: 600; color: var(--text); }
    .sec-stat-email { font-size: 11px; color: var(--text-secondary); }
    .sec-stat-time { font-size: 11px; color: var(--text-secondary); }
    .sec-stat-empty { text-align: center; padding: 30px; color: var(--text-secondary); }
    
    .sec-ann-empty { text-align: center; padding: 50px 20px; background: var(--bg); border-radius: 12px; border: 2px dashed var(--border); }
    
    @media (max-width: 600px) {
        .ann-list { grid-template-columns: 1fr; }
        .ann-card-stats { flex-wrap: wrap; gap: 10px; }
    }


/* Source: includes/sec-announcements.php line 2339 (block 6/13) */
.sec-form-back { display: inline-block; margin-bottom: 15px; color: var(--text-secondary); text-decoration: none; font-size: 13px; }
        .sec-form-back:hover { color: var(--text); }
        .sec-form-title { margin: 0 0 20px; font-size: 18px; }
        .sec-field { margin-bottom: 16px; }
        .sec-field label { display: block; font-size: 13px; font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; }
        .sec-field input, .sec-field select { width: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 14px; }
        .sec-field input:focus, .sec-field select:focus { outline: none; border-color: var(--primary); }
        .sec-field-hint { font-size: 11px; color: var(--text-secondary); margin-top: 4px; }
        .sec-field-row { display: flex; gap: 12px; }
        .sec-field-row .sec-field { flex: 1; }
        .sec-themes { display: flex; gap: 8px; flex-wrap: wrap; }
        .sec-theme-opt { cursor: pointer; }
        .sec-theme-opt input { display: none; }
        .sec-theme-btn { display: inline-block; padding: 8px 14px; border-radius: 8px; font-size: 12px; font-weight: 600; border: 2px solid transparent; }
        .sec-theme-btn.info { background: var(--info-bg); color: var(--info-text); }
        .sec-theme-btn.success { background: var(--success-bg); color: var(--success-text); }
        .sec-theme-btn.urgent { background: var(--warning-bg); color: var(--warning-text); }
        .sec-theme-btn.critical { background: var(--danger-bg); color: var(--danger-text); }
        .sec-theme-opt input:checked + .sec-theme-btn { border-color: currentColor; box-shadow: 0 0 0 2px currentColor; }
        .sec-checkbox { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; }
        .sec-checkbox input { width: auto; }
        .sec-submit { width: 100%; padding: 14px; background: var(--primary); color: var(--text-inverse); border: none; border-radius: 10px; font-size: 15px; font-weight: 700; cursor: pointer; }
        .sec-submit:hover { opacity: 0.9; }
        
        /* Audience Selector */
        .sec-audience-section { background: var(--bg); border-radius: 10px; padding: 16px; margin-bottom: 16px; }
        .sec-audience-section h4 { margin: 0 0 12px; font-size: 14px; color: var(--text); }
        .sec-audience-options { display: flex; flex-direction: column; gap: 8px; }
        .sec-audience-opt { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--surface); border: 2px solid var(--border); border-radius: 8px; cursor: pointer; transition: all 0.2s; }
        .sec-audience-opt:hover { border-color: var(--border); }
        .sec-audience-opt.selected { border-color: var(--primary); background: rgba(var(--primary-rgb), 0.03); }
        .sec-audience-opt input { display: none; }
        .sec-audience-icon { font-size: 20px; }
        .sec-audience-info { flex: 1; }
        .sec-audience-title { font-weight: 600; font-size: 13px; color: var(--text); }
        .sec-audience-desc { font-size: 11px; color: var(--text-secondary); }
        .sec-audience-check { width: 20px; height: 20px; border: 2px solid var(--border); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
        .sec-audience-opt.selected .sec-audience-check { background: var(--primary); border-color: var(--primary); color: var(--text-inverse); }
        
        /* Program Pills */
        .sec-programs-selector { display: none; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
        .sec-programs-selector.show { display: block; }
        .sec-programs-label { font-size: 12px; font-weight: 600; color: var(--text-secondary); margin-bottom: 8px; }
        .sec-program-pills { display: flex; flex-wrap: wrap; gap: 8px; }
        .sec-program-pill { display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--surface); border: 2px solid var(--border); border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 500; transition: all 0.2s; }
        .sec-program-pill:hover { border-color: var(--border); }
        .sec-program-pill.selected { background: var(--primary); border-color: var(--primary); color: var(--text-inverse); }
        .sec-program-pill input { display: none; }
        
        @media (max-width: 600px) {
            .sec-field-row { flex-direction: column; }
        }


/* Source: includes/sec-announcements.php line 2612 (block 7/13) */
.sec-fe-notice { padding:12px 16px; border-radius:8px; margin-bottom:16px; font-size:14px; }
    .sec-fe-notice.success { background:var(--success-bg); color:var(--success-text); }
    .sec-fe-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; flex-wrap:wrap; gap:10px; }
    .sec-fe-header h3 { margin:0; font-size:18px; }
    .sec-fe-header p { margin:5px 0 0; color:var(--text-secondary); font-size:13px; }
    .sec-btn-new { padding:10px 18px; background:var(--primary); color:var(--text-inverse); border-radius:8px; text-decoration:none; font-weight:600; font-size:13px; display:inline-block; }
    
    /* Poll Cards - Matching Backend Exactly */
    .sec-polls-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 16px;
    }
    .sec-poll-item-card {
        background: var(--surface);
        border-radius: 16px;
        padding: 20px;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        transition: all 0.3s;
        border: 1px solid var(--border);
        display: flex;
        flex-direction: column;
    }
    .sec-poll-item-card:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        transform: translateY(-2px);
    }
    .sec-poll-item-card.poll-ended {
        opacity: 0.7;
    }
    .sec-pi-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 14px;
    }
    .sec-pi-status {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        padding: 5px 12px;
        border-radius: 16px;
        letter-spacing: 0.5px;
    }
    .sec-pi-status.active {
        background: linear-gradient(135deg, var(--success-bg) 0%, var(--success-bg) 100%);
        color: var(--success-text);
    }
    .sec-pi-status.ended {
        background: var(--border-light);
        color: var(--text-secondary);
    }
    .sec-pi-status.draft {
        background: var(--warning-bg);
        color: var(--warning-text);
    }
    .sec-pi-title {
        font-size: 17px;
        font-weight: 700;
        color: var(--text);
        margin-bottom: 16px;
        line-height: 1.35;
    }
    .sec-poll-graph {
        margin: 12px 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .sec-pg-bar-wrap {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
    }
    .sec-pg-label {
        width: 80px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: var(--text-secondary);
        font-weight: 500;
    }
    .sec-pg-bg {
        flex: 1;
        height: 8px;
        background: var(--border-light);
        border-radius: 4px;
        overflow: hidden;
    }
    .sec-pg-fill {
        height: 100%;
        border-radius: 4px;
        transition: width 0.5s;
    }
    .sec-pg-val {
        min-width: 55px;
        text-align: right;
        font-weight: 600;
        color: var(--text);
        font-size: 12px;
    }
    .sec-pi-stats {
        display: flex;
        justify-content: center;
        padding-top: 12px;
        margin-top: auto;
    }
    .sec-pi-stats-label {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: var(--text-secondary);
        text-align: center;
        padding-bottom: 8px;
    }
    /* Donut Chart */
    .sec-donut-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 16px 0;
    }
    .sec-donut {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        position: relative;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }
    .sec-donut-center {
        position: absolute;
        top: 18%;
        left: 18%;
        width: 64%;
        height: 64%;
        background: var(--surface);
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        box-shadow: inset 0 1px 4px rgba(0,0,0,0.05);
    }
    .sec-donut-num {
        font-weight: 800;
        font-size: 20px;
        color: var(--text);
        line-height: 1;
    }
    .sec-donut-label {
        font-size: 8px;
        text-transform: uppercase;
        color: var(--text-secondary);
        font-weight: 700;
        margin-top: 2px;
    }
    .sec-poll-meta {
        display: flex;
        gap: 10px;
        font-size: 11px;
        color: var(--text-secondary);
        padding: 8px 0;
        border-top: 1px solid var(--border-light);
        flex-wrap: wrap;
    }
    .sec-pi-actions {
        margin-top: 12px;
        display: flex;
        gap: 8px;
    }
    .sec-pi-actions .btn-wrap {
        flex: 1;
        display: flex;
    }
    .sec-pi-actions .btn-wrap a,
    .sec-pi-actions .btn-wrap button {
        flex: 1;
        padding: 8px !important;
        border-radius: 8px !important;
        border: 1px solid var(--border) !important;
        text-align: center;
        text-decoration: none !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        color: var(--text-secondary) !important;
        background: var(--surface) !important;
        cursor: pointer;
        transition: all 0.2s;
        box-shadow: none !important;
        line-height: 1.4 !important;
        margin: 0 !important;
    }
    .sec-pi-actions .btn-wrap a:hover,
    .sec-pi-actions .btn-wrap button:hover {
        background: var(--bg) !important;
        border-color: var(--border) !important;
    }
    .sec-pi-actions .btn-wrap .view { color: var(--info) !important; }
    .sec-pi-actions .btn-wrap .delete { color: var(--danger) !important; }
    .sec-pi-actions .btn-wrap .delete:hover { background: var(--danger-bg) !important; }
    .sec-pi-btn {
        flex: 1;
        padding: 8px;
        border-radius: 8px;
        border: 1px solid var(--border);
        text-align: center;
        text-decoration: none;
        font-size: 12px;
        font-weight: 600;
        color: var(--text-secondary);
        background: var(--surface);
        cursor: pointer;
        transition: all 0.2s;
    }
    .sec-pi-btn:hover {
        background: var(--bg);
        border-color: var(--border);
    }
    .sec-pi-btn.view { color: var(--info); }
    .sec-pi-btn.delete { color: var(--danger); }
    .sec-pi-btn.delete:hover { background: var(--danger-bg); }
    .sec-poll-empty { text-align:center; padding:50px 20px; background:var(--bg); border-radius:12px; border:2px dashed var(--border); }
    .sec-poll-target { font-size:10px; background:var(--info-bg); color:var(--info-text); padding:3px 8px; border-radius:10px; }
    
    @media (max-width:600px) { .sec-polls-grid { grid-template-columns:1fr; } }


/* Source: includes/sec-announcements.php line 3023 (block 8/13) */
/* Modal Styles (shared with announcements) */
    .sec-stat-modal {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 99999;
        align-items: center;
        justify-content: center;
        padding: 20px;
    }
    .sec-stat-modal.show { display: flex; }
    .sec-stat-modal-content {
        background: var(--surface);
        border-radius: 12px;
        width: 100%;
        max-width: 500px;
        max-height: 80vh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    .sec-stat-modal-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        background: var(--bg);
        border-bottom: 1px solid var(--border);
    }
    .sec-stat-modal-header h3 { margin: 0; font-size: 16px; }
    .sec-stat-modal-close {
        width: 30px;
        height: 30px;
        border: none;
        background: var(--border);
        border-radius: 50%;
        cursor: pointer;
        font-size: 18px;
        color: var(--text-secondary);
    }
    .sec-stat-modal-body {
        padding: 20px;
        overflow-y: auto;
        flex: 1;
    }
    .sec-stat-list { list-style: none; padding: 0; margin: 0; }
    .sec-stat-list li {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 12px;
        background: var(--bg);
        border-radius: 8px;
        margin-bottom: 8px;
        font-size: 13px;
    }
    .sec-stat-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: var(--primary);
        color: var(--text-inverse);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 14px;
    }
    .sec-stat-info { flex: 1; }
    .sec-stat-name { font-weight: 600; color: var(--text); }
    .sec-stat-email { font-size: 11px; color: var(--text-secondary); }
    .sec-stat-time { font-size: 11px; color: var(--text-secondary); }
    .sec-stat-empty { text-align: center; padding: 30px; color: var(--text-secondary); }


/* Source: includes/sec-announcements.php line 3113 (block 9/13) */
.sec-poll-form-back { display:inline-block; margin-bottom:15px; color:var(--text-secondary); text-decoration:none; font-size:13px; }
        .sec-poll-form-title { margin:0 0 20px; font-size:18px; }
        .sec-pf-field { margin-bottom:16px; }
        .sec-pf-field label { display:block; font-size:13px; font-weight:600; color:var(--text-secondary); margin-bottom:6px; }
        .sec-pf-field input, .sec-pf-field select { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:14px; }
        .sec-pf-field input:focus, .sec-pf-field select:focus { outline:none; border-color:var(--primary); }
        .sec-pf-row { display:flex; gap:12px; }
        .sec-pf-row .sec-pf-field { flex:1; }
        .sec-pf-options { background:var(--bg); border-radius:10px; padding:16px; margin-bottom:16px; }
        .sec-pf-opt-item { display:flex; gap:8px; margin-bottom:8px; }
        .sec-pf-opt-item input { flex:1; }
        .sec-pf-opt-remove { width:36px; height:36px; border:none; background:var(--danger-bg); color:var(--danger); border-radius:6px; cursor:pointer; font-size:16px; }
        .sec-pf-add-opt { width:100%; padding:10px; border:2px dashed var(--border); border-radius:8px; background:transparent; color:var(--text-secondary); cursor:pointer; font-size:13px; }
        .sec-pf-add-opt:hover { border-color:var(--text-secondary); background:var(--border-light); }
        .sec-pf-section { background:var(--bg); border-radius:10px; padding:16px; margin-bottom:16px; }
        .sec-pf-section h4 { margin:0 0 12px; font-size:14px; color:var(--text); }
        .sec-pf-toggle { display:flex; align-items:center; justify-content:space-between; padding:10px 0; }
        .sec-pf-toggle-info { flex:1; }
        .sec-pf-toggle-label { font-weight:600; font-size:13px; color:var(--text); }
        .sec-pf-toggle-desc { font-size:11px; color:var(--text-secondary); }
        .sec-pf-switch { position:relative; width:44px; height:24px; }
        .sec-pf-switch input { opacity:0; width:0; height:0; }
        .sec-pf-slider { position:absolute; cursor:pointer; inset:0; background:var(--border); border-radius:24px; transition:0.3s; }
        .sec-pf-slider:before { content:''; position:absolute; height:18px; width:18px; left:3px; bottom:3px; background:var(--surface); border-radius:50%; transition:0.3s; }
        .sec-pf-switch input:checked + .sec-pf-slider { background:var(--primary); }
        .sec-pf-switch input:checked + .sec-pf-slider:before { transform:translateX(20px); }
        .sec-pf-submit { width:100%; padding:14px; background:var(--primary); color:var(--text-inverse); border:none; border-radius:10px; font-size:15px; font-weight:700; cursor:pointer; }
        .sec-pf-submit:hover { opacity:0.9; }
        .sec-pf-audience { display:flex; flex-direction:column; gap:8px; }
        .sec-pf-aud-opt { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--surface); border:2px solid var(--border); border-radius:8px; cursor:pointer; }
        .sec-pf-aud-opt:hover { border-color:var(--border); }
        .sec-pf-aud-opt.selected { border-color:var(--primary); background:rgba(var(--primary-rgb), 0.03); }
        .sec-pf-aud-opt input { display:none; }
        .sec-pf-aud-icon { font-size:20px; }
        .sec-pf-aud-info { flex:1; }
        .sec-pf-aud-info strong { display:block; font-size:13px; }
        .sec-pf-aud-info span { font-size:11px; color:var(--text-secondary); }
        .sec-pf-aud-check { width:20px; height:20px; border:2px solid var(--border); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; color:transparent; }
        .sec-pf-aud-opt.selected .sec-pf-aud-check { background:var(--primary); border-color:var(--primary); color:var(--text-inverse); }
        .sec-pf-progs { display:none; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
        .sec-pf-progs.show { display:block; }
        .sec-pf-prog-pills { display:flex; flex-wrap:wrap; gap:8px; }
        .sec-pf-prog-pill { padding:8px 14px; background:var(--surface); border:2px solid var(--border); border-radius:20px; cursor:pointer; font-size:13px; }
        .sec-pf-prog-pill:hover { border-color:var(--border); }
        .sec-pf-prog-pill.selected { background:var(--primary); border-color:var(--primary); color:var(--text-inverse); }
        .sec-pf-prog-pill input { display:none; }
        @media (max-width:600px) { .sec-pf-row { flex-direction:column; } }


/* Source: includes/sec-announcements.php line 3373 (block 10/13) */
.sec-email-tabs { display:flex; gap:4px; margin-bottom:20px; border-bottom:1px solid var(--border); padding-bottom:0; }
        .sec-email-tab { padding:10px 16px; font-size:13px; font-weight:600; color:var(--text-secondary); text-decoration:none; border-bottom:3px solid transparent; margin-bottom:-1px; }
        .sec-email-tab:hover { color:var(--text); }
        .sec-email-tab.active { color:var(--primary); border-bottom-color:var(--primary); }
        .sec-email-tab .badge { background:var(--danger); color:var(--text-inverse); font-size:10px; padding:2px 6px; border-radius:10px; margin-left:4px; }
        .sec-fe-notice { padding:12px 16px; border-radius:8px; margin-bottom:16px; font-size:14px; }
        .sec-fe-notice.success { background:var(--success-bg); color:var(--success-text); }
        .sec-fe-notice.error { background:var(--danger-bg); color:var(--danger-text); }
        .sec-email-field { margin-bottom:16px; }
        .sec-email-field label { display:block; font-size:13px; font-weight:600; color:var(--text-secondary); margin-bottom:6px; }
        .sec-email-field input, .sec-email-field textarea, .sec-email-field select { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:14px; }
        .sec-email-field input:focus, .sec-email-field textarea:focus { outline:none; border-color:var(--primary); }
        .sec-email-field textarea { min-height:200px; font-family:inherit; }
        .sec-email-section { background:var(--bg); border-radius:10px; padding:16px; margin-bottom:16px; }
        .sec-email-section h4 { margin:0 0 12px; font-size:14px; color:var(--text); }
        .sec-email-aud-opts { display:flex; flex-direction:column; gap:8px; }
        .sec-email-aud-opt { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--surface); border:2px solid var(--border); border-radius:8px; cursor:pointer; }
        .sec-email-aud-opt:hover { border-color:var(--border); }
        .sec-email-aud-opt.selected { border-color:var(--primary); background:rgba(var(--primary-rgb), 0.03); }
        .sec-email-aud-opt input[type="radio"] { display:none; }
        .sec-email-aud-icon { font-size:20px; }
        .sec-email-aud-info { flex:1; }
        .sec-email-aud-info strong { display:block; font-size:13px; }
        .sec-email-aud-info span { font-size:11px; color:var(--text-secondary); }
        .sec-email-aud-check { width:20px; height:20px; border:2px solid var(--border); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; color:transparent; }
        .sec-email-aud-opt.selected .sec-email-aud-check { background:var(--primary); border-color:var(--primary); color:var(--text-inverse); }
        .sec-email-progs { display:none; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
        .sec-email-progs.show { display:block; }
        .sec-email-prog-pills { display:flex; flex-wrap:wrap; gap:8px; }
        .sec-email-prog-pill { padding:8px 14px; background:var(--surface); border:2px solid var(--border); border-radius:20px; cursor:pointer; font-size:13px; }
        .sec-email-prog-pill:hover { border-color:var(--border); }
        .sec-email-prog-pill.selected { background:var(--primary); border-color:var(--primary); color:var(--text-inverse); }
        .sec-email-prog-pill input { display:none; }
        .sec-email-actions { display:flex; gap:10px; }
        .sec-email-btn { flex:1; padding:14px; border:none; border-radius:10px; font-size:14px; font-weight:600; cursor:pointer; }
        .sec-email-btn.primary { background:var(--primary); color:var(--text-inverse); }
        .sec-email-btn.secondary { background:var(--border); color:var(--text-secondary); }
        .sec-email-btn:hover { opacity:0.9; }
        .sec-email-list { display:flex; flex-direction:column; gap:10px; }
        .sec-email-item { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:var(--surface); border:1px solid var(--border); border-radius:10px; gap:12px; }
        .sec-email-item:hover { border-color:var(--border); }
        .sec-email-item-main { flex:1; min-width:0; }
        .sec-email-item-subject { font-weight:600; color:var(--text); font-size:14px; margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .sec-email-item-meta { font-size:11px; color:var(--text-secondary); }
        .sec-email-item-actions { display:flex; gap:6px; }
        .sec-email-item-btn { padding:8px 12px; border:1px solid var(--border); border-radius:6px; background:var(--surface); font-size:12px; cursor:pointer; text-decoration:none; color:var(--text-secondary); }
        .sec-email-item-btn:hover { background:var(--bg); }
        .sec-email-item-btn.delete:hover { background:var(--danger-bg); color:var(--danger); }
        .sec-email-empty { text-align:center; padding:40px 20px; background:var(--bg); border-radius:12px; border:2px dashed var(--border); }


/* Source: includes/sec-announcements.php line 3842 (block 11/13) */
.sec-trivia-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; flex-wrap:wrap; gap:10px; }
        .sec-trivia-stats { display:flex; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
        .sec-trivia-stat { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:16px 20px; text-align:center; min-width:100px; }
        .sec-trivia-stat-num { font-size:24px; font-weight:700; color:var(--primary); }
        .sec-trivia-stat-label { font-size:11px; color:var(--text-secondary); text-transform:uppercase; }
        .sec-trivia-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:16px; }
        .sec-trivia-card { background:var(--surface); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
        .sec-trivia-card-header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:var(--bg); border-bottom:1px solid var(--border); }
        .sec-trivia-status { font-size:10px; font-weight:700; padding:3px 8px; border-radius:4px; color:var(--text-inverse); }
        .sec-trivia-status.active { background:var(--success); }
        .sec-trivia-status.paused { background:var(--warning); }
        .sec-trivia-question { padding:16px; font-size:14px; font-weight:600; color:var(--text); }
        .sec-trivia-options { padding:0 16px 16px; }
        .sec-trivia-opt { display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--bg); border-radius:6px; margin-bottom:6px; font-size:13px; }
        .sec-trivia-opt.correct { background:var(--success-bg); border:1px solid var(--success); }
        .sec-trivia-opt-marker { width:18px; height:18px; border-radius:50%; background:var(--border); display:flex; align-items:center; justify-content:center; font-size:10px; }
        .sec-trivia-opt.correct .sec-trivia-opt-marker { background:var(--success); color:var(--text-inverse); }
        .sec-trivia-card-stats { display:flex; justify-content:space-around; padding:12px; background:var(--bg); border-top:1px solid var(--border); }
        .sec-trivia-card-stat { text-align:center; }
        .sec-trivia-card-stat-num { font-size:18px; font-weight:700; color:var(--text); }
        .sec-trivia-card-stat-label { font-size:9px; color:var(--text-secondary); text-transform:uppercase; }
        .sec-trivia-actions { display:flex; gap:6px; padding:12px 16px; border-top:1px solid var(--border); }
        .sec-trivia-actions .btn-wrap { flex:1; display:flex; }
        .sec-trivia-actions .btn-wrap a,
        .sec-trivia-actions .btn-wrap button { flex:1; padding:8px !important; border:1px solid var(--border) !important; border-radius:6px !important; background:var(--surface) !important; font-size:12px !important; cursor:pointer; text-decoration:none !important; color:var(--text-secondary) !important; text-align:center; box-shadow:none !important; line-height:1.4 !important; margin:0 !important; }
        .sec-trivia-actions .btn-wrap a:hover,
        .sec-trivia-actions .btn-wrap button:hover { background:var(--bg) !important; }
        .sec-trivia-actions .btn-wrap .delete:hover { background:var(--danger-bg) !important; color:var(--danger) !important; }
        .sec-trivia-btn { flex:1; padding:8px; border:1px solid var(--border); border-radius:6px; background:var(--surface); font-size:12px; cursor:pointer; text-decoration:none; color:var(--text-secondary); text-align:center; }
        .sec-trivia-btn:hover { background:var(--bg); }
        .sec-trivia-btn.delete:hover { background:var(--danger-bg); color:var(--danger); }
        .sec-trivia-empty { text-align:center; padding:50px 20px; background:var(--bg); border-radius:12px; border:2px dashed var(--border); }
        @media (max-width:600px) { .sec-trivia-grid { grid-template-columns:1fr; } .sec-trivia-stats { flex-direction:column; } }


/* Source: includes/sec-announcements.php line 3985 (block 12/13) */
.sec-tf-back { display:inline-block; margin-bottom:15px; color:var(--text-secondary); text-decoration:none; font-size:13px; }
        .sec-tf-title { margin:0 0 20px; font-size:18px; }
        .sec-tf-field { margin-bottom:16px; }
        .sec-tf-field label { display:block; font-size:13px; font-weight:600; color:var(--text-secondary); margin-bottom:6px; }
        .sec-tf-field input, .sec-tf-field select { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:14px; }
        .sec-tf-field input:focus, .sec-tf-field select:focus { outline:none; border-color:var(--primary); }
        .sec-tf-row { display:flex; gap:12px; }
        .sec-tf-row .sec-tf-field { flex:1; }
        .sec-tf-options { background:var(--bg); border-radius:10px; padding:16px; margin-bottom:16px; }
        .sec-tf-opt-item { display:flex; gap:8px; margin-bottom:8px; align-items:center; }
        .sec-tf-opt-item input[type="text"] { flex:1; }
        .sec-tf-opt-radio { width:20px; height:20px; accent-color:var(--primary); }
        .sec-tf-opt-remove { width:36px; height:36px; border:none; background:var(--danger-bg); color:var(--danger); border-radius:6px; cursor:pointer; font-size:16px; }
        .sec-tf-add-opt { width:100%; padding:10px; border:2px dashed var(--border); border-radius:8px; background:transparent; color:var(--text-secondary); cursor:pointer; font-size:13px; }
        .sec-tf-add-opt:hover { border-color:var(--text-secondary); background:var(--border-light); }
        .sec-tf-hint { font-size:11px; color:var(--text-secondary); margin-top:6px; }
        .sec-tf-section { background:var(--bg); border-radius:10px; padding:16px; margin-bottom:16px; }
        .sec-tf-section h4 { margin:0 0 12px; font-size:14px; color:var(--text); }
        .sec-tf-toggle { display:flex; align-items:center; justify-content:space-between; padding:10px 0; }
        .sec-tf-toggle-info { flex:1; }
        .sec-tf-toggle-label { font-weight:600; font-size:13px; color:var(--text); }
        .sec-tf-toggle-desc { font-size:11px; color:var(--text-secondary); }
        .sec-tf-switch { position:relative; width:44px; height:24px; }
        .sec-tf-switch input { opacity:0; width:0; height:0; }
        .sec-tf-slider { position:absolute; cursor:pointer; inset:0; background:var(--border); border-radius:24px; transition:0.3s; }
        .sec-tf-slider:before { content:''; position:absolute; height:18px; width:18px; left:3px; bottom:3px; background:var(--surface); border-radius:50%; transition:0.3s; }
        .sec-tf-switch input:checked + .sec-tf-slider { background:var(--primary); }
        .sec-tf-switch input:checked + .sec-tf-slider:before { transform:translateX(20px); }
        .sec-tf-submit { width:100%; padding:14px; background:var(--primary); color:var(--text-inverse); border:none; border-radius:10px; font-size:15px; font-weight:700; cursor:pointer; }
        .sec-tf-submit:hover { opacity:0.9; }
        @media (max-width:600px) { .sec-tf-row { flex-direction:column; } }


/* Source: includes/sec-announcements.php line 4192 (block 13/13) */
.sec-fe-analytics { padding:0; }
        .sec-fe-analytics-header { margin-bottom:20px; }
        .sec-fe-analytics-header h3 { margin:0 0 4px; font-size:18px; }
        .sec-fe-analytics-header p { margin:0; font-size:12px; color:var(--text-secondary); }
        
        .sec-fe-stats-row { display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; margin-bottom:20px; }
        .sec-fe-stat-card { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px; text-align:center; }
        .sec-fe-stat-value { font-size:28px; font-weight:700; color:var(--primary); }
        .sec-fe-stat-label { font-size:11px; color:var(--text-secondary); text-transform:uppercase; margin-top:4px; }
        
        .sec-fe-section { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px; margin-bottom:16px; }
        .sec-fe-section-title { font-size:14px; font-weight:600; color:var(--text); margin:0 0 12px; display:flex; align-items:center; gap:8px; }
        
        .sec-fe-bar-chart { display:flex; flex-direction:column; gap:10px; }
        .sec-fe-bar-item { display:flex; align-items:center; gap:10px; }
        .sec-fe-bar-label { width:80px; font-size:12px; color:var(--text-secondary); }
        .sec-fe-bar-track { flex:1; height:8px; background:var(--border-light); border-radius:4px; overflow:hidden; }
        .sec-fe-bar-fill { height:100%; background:var(--primary); border-radius:4px; }
        .sec-fe-bar-value { width:40px; text-align:right; font-size:12px; font-weight:600; color:var(--text); }
        
        .sec-fe-top-list { display:flex; flex-direction:column; gap:10px; }
        .sec-fe-top-item { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--bg); border-radius:8px; }
        .sec-fe-top-rank { width:24px; height:24px; background:var(--primary); color:var(--text-inverse); border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; }
        .sec-fe-top-info { flex:1; min-width:0; }
        .sec-fe-top-title { font-size:13px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .sec-fe-top-meta { font-size:11px; color:var(--text-secondary); }
        .sec-fe-top-type { font-size:14px; }
        
        .sec-fe-activity-list { max-height:250px; overflow-y:auto; }
        .sec-fe-activity-item { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--border-light); }
        .sec-fe-activity-icon { width:28px; height:28px; background:var(--border-light); border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:12px; }
        .sec-fe-activity-info { flex:1; }
        .sec-fe-activity-text { font-size:12px; color:var(--text); }
        .sec-fe-activity-time { font-size:10px; color:var(--text-secondary); }
        
        .sec-fe-empty { text-align:center; padding:40px 20px; background:var(--bg); border-radius:12px; }
        .sec-fe-empty-icon { font-size:36px; margin-bottom:12px; }
        .sec-fe-empty h4 { margin:0 0 8px; font-size:16px; }
        .sec-fe-empty p { margin:0; font-size:13px; color:var(--text-secondary); }
        
        @media (max-width:500px) {
            .sec-fe-stats-row { grid-template-columns:1fr; }
        }


