/* General Styling */
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    margin: 0;
    background-color: #f4f7f6;
    color: #333;
    display: flex;
}
.main-wrapper { display: flex; width: 100vw; height: 100vh; }
a { text-decoration: none; color: #0ea5e9; }

/* Login Page */
.login-container { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; background-color: #374151; }
.login-form { background: white; padding: 40px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); width: 100%; max-width: 360px; }
.login-form h2 { text-align: center; margin-bottom: 24px; color: #111827; }
.login-form .form-group { margin-bottom: 20px; }
.login-form label { display: block; margin-bottom: 8px; font-weight: 600; }
.login-form input { width: 100%; padding: 12px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box; }
.login-form .error { color: #ef4444; background: #fee2e2; padding: 10px; border-radius: 6px; margin-bottom: 15px; text-align: center; }
.btn { width: 100%; padding: 12px; border: none; border-radius: 6px; background-color: #0ea5e9; color: white; font-weight: 700; font-size: 1rem; cursor: pointer; transition: background-color 0.2s ease; }
.btn:hover { background-color: #0c87bf; }

/* Admin Layout */
.sidebar { width: 240px; background-color: #1f2937; color: #f9fafb; display: flex; flex-direction: column; height: 100vh; flex-shrink: 0; }
.sidebar-header { padding: 24px; font-size: 1.5rem; font-weight: 800; text-align: center; border-bottom: 1px solid #374151; }
.sidebar-header span { color: #0ea5e9; }
.sidebar-nav { flex-grow: 1; }
.sidebar-nav ul { list-style: none; padding: 0; margin: 20px 0; }
.sidebar-nav a { display: block; padding: 15px 24px; color: #d1d5db; transition: background-color 0.2s, color 0.2s; font-weight: 500; }
.sidebar-nav a:hover, .sidebar-nav a.active { background-color: #374151; color: white; }
.sidebar-nav a i { margin-right: 12px; }
.logout-link { margin-top: auto; border-top: 1px solid #374151; }

.main-content { flex-grow: 1; display: flex; flex-direction: column; height: 100vh; }
.top-bar { padding: 16px 24px; background: white; border-bottom: 1px solid #e5e7eb; box-shadow: 0 1px 3px rgba(0,0,0,0.05); font-weight: 600;}
.content { padding: 24px; overflow-y: auto; flex-grow: 1; }

/* Content Styling */
.content h1 { font-size: 1.75rem; margin-bottom: 24px; color: #111827; }

/* Table */
.data-table { width: 100%; border-collapse: collapse; background: white; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 4px rgba(0,0,0,0.05); }
.data-table th, .data-table td { padding: 16px; text-align: left; border-bottom: 1px solid #e5e7eb; }
.data-table th { background-color: #f9fafb; font-weight: 600; color: #6b7280; }
.data-table tbody tr:hover { background-color: #f9fafb; }
.btn-sm { padding: 6px 12px; font-size: 0.875rem; }
.btn-secondary { background-color: #6b7280; } .btn-secondary:hover { background-color: #4b5563; }
.btn-danger { background-color: #ef4444; } .btn-danger:hover { background-color: #dc2626; }

/* Form */
.post-form { background: white; padding: 24px; border-radius: 8px; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; margin-bottom: 8px; font-weight: 600; }
.form-group input[type="text"], .form-group input[type="file"], .form-group select, .form-group textarea { width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 6px; box-sizing: border-box; }
.form-group textarea { min-height: 80px; resize: vertical; }

/* Quill Editor Styling */
.quill-editor { min-height: 250px; background-color: white; border: 1px solid #d1d5db; border-radius: 6px; }
.ql-toolbar.ql-snow { border-top-left-radius: 6px; border-top-right-radius: 6px; }
.ql-container.ql-snow { border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; }


/* Accordion */
.accordion { margin-bottom: 1rem; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }
.accordion-header { width: 100%; background-color: #f9fafb; padding: 15px; border: none; text-align: left; font-size: 1.1rem; font-weight: 600; cursor: pointer; }
.accordion-header:hover { background-color: #f3f4f6; }
.accordion-content { padding: 20px; display: none; } /* Default hidden */

/* FAQ Form */
#faq-container .faq-item { display: flex; gap: 10px; margin-bottom: 10px; align-items: center; }
#faq-container .faq-item input { flex-grow: 1; }
.btn-remove-faq { background: #ef4444; color: white; border: none; padding: 8px 12px; border-radius: 4px; cursor: pointer; }

/* Messages */
.message { padding: 15px; border-radius: 6px; margin-bottom: 20px; }
.message.success { background-color: #d1fae5; color: #065f46; }
.message.error { background-color: #fee2e2; color: #991b1b; }