/* responsive.css */

@media(max-width:900px){
  .nav-links{display:none}
  .nav-actions{display:none}
  .nav-toggle{display:flex}
  .nav-mobile{display:block}
  .about-grid{grid-template-columns:1fr;gap:32px}
  .about-photo{max-width:200px}
  .stats-bar{grid-template-columns:repeat(2,1fr)}
  .featured-card{grid-template-columns:1fr}
  .featured-cover{min-height:180px;border-right:none;border-bottom:1px solid var(--border)}
  .articles-grid{grid-template-columns:1fr}
  .topics-grid{grid-template-columns:repeat(2,1fr)}
  .book-split{grid-template-columns:1fr}
  .book-cover{max-width:200px}
  .book-reviews{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto}
  .newsletter-form{flex-direction:column;width:100%}
  .newsletter-split{padding:40px 0;gap:24px}
}
@media(max-width:600px){
  .hero{padding:64px 0 48px}
  .section{padding:64px 0}
  .stats-bar{grid-template-columns:1fr}
  .topics-grid{grid-template-columns:1fr}
  .featured-body{padding:28px}
  .book-split{padding:32px 24px}
  .newsletter-split{padding:32px 24px}
  .footer-inner{flex-direction:column;text-align:center}
  .footer-links{justify-content:center}
}

/* Article view & login */
.article-page{padding:80px 0 96px}
.article-page h1{font-family:var(--font-serif);font-size:clamp(1.9rem,3.5vw,2.6rem);line-height:1.2;margin-bottom:14px;letter-spacing:-0.02em}
.article-meta-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:32px;color:var(--fg-muted);font-size:0.875rem}
.article-body{font-family:var(--font-serif);font-size:1.0625rem;line-height:1.85;color:var(--fg);}
.article-body p{margin-bottom:18px}
.article-body p:last-child{margin-bottom:0}
.article-body h2{font-family:var(--font-serif);font-size:1.5rem;margin:32px 0 14px}
.article-body h3{font-family:var(--font-serif);font-size:1.2rem;margin:24px 0 12px}
.article-body blockquote{border-left:3px solid var(--gold);padding:6px 18px;margin:20px 0;color:var(--fg-muted);font-style:italic;background:var(--gold-light)}
.article-back{margin-top:48px;font-size:0.875rem}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:10px;margin-top:48px;flex-wrap:wrap}
.pagination a,.pagination span{
  padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius);
  font-size:0.875rem;color:var(--fg-muted);background:var(--bg);
}
.pagination a:hover{border-color:var(--gold);color:var(--gold)}
.pagination .current{border-color:var(--gold);color:var(--gold);background:var(--gold-light)}
.pagination .disabled{opacity:0.4;pointer-events:none}

/* Flash */
.flash{max-width:1100px;margin:16px auto;padding:10px 16px;border-radius:var(--radius);font-size:0.875rem;font-weight:500}
.flash-success{background:#1a3322;color:#9bd8a1;border:1px solid #2a4a30}
.flash-error{background:#3a1f1f;color:#e89b9b;border:1px solid #5a2a2a}

.review-avatar{width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;overflow:hidden;background:var(--gold);color:#1a1a1a;font-weight:700;vertical-align:middle;margin-right:8px}.review-avatar img{width:100%;height:100%;object-fit:cover}.review-avatar--small{width:28px;height:28px;font-size:.75rem;margin-right:4px}
.comments-section{margin-top:64px;padding-top:48px;border-top:1px solid var(--border)}
.comments-section h3{font-family:var(--font-serif);font-size:1.4rem;margin-bottom:24px}
.comment-form{display:grid;gap:12px;margin-bottom:36px}
.comment-form input,.comment-form textarea{
  padding:12px 16px;border:1px solid var(--border);
  border-radius:var(--radius);background:var(--bg);color:var(--fg);
  font-family:var(--font-sans);font-size:0.875rem;outline:none;transition:border-color 0.15s;
}
.comment-form textarea{min-height:120px;resize:vertical}
.comment-form input:focus,.comment-form textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,168,87,0.12)}
.comment-list{display:grid;gap:16px}
.comment-card{border:1px solid var(--border);border-radius:var(--radius);padding:20px;background:var(--bg)}
.comment-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:0.8125rem;color:var(--fg-muted)}
.comment-head strong{color:var(--fg);font-weight:600;margin-right:6px}
.comment-body{font-size:0.9375rem;line-height:1.7;color:var(--fg-muted)}
.comment-pending{font-size:0.75rem;color:var(--gold);margin-top:8px;font-style:italic}

/* Forms */
.form-stack{display:grid;gap:16px;width:100%;max-width:var(--content-width)}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:0.875rem;font-weight:600;color:var(--fg)}
.field input,.field textarea,.field select{
  padding:12px 16px;border:1px solid var(--border);
  border-radius:var(--radius);background:var(--bg);color:var(--fg);
  font-family:var(--font-sans);font-size:0.875rem;outline:none;transition:border-color 0.15s;
}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,168,87,0.12)}
.field textarea{min-height:140px;resize:vertical}
.field .hint{font-size:0.75rem;color:var(--fg-subtle)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.field-row{grid-template-columns:1fr}}
.checkbox-row{display:flex;align-items:center;gap:8px;font-size:0.875rem;color:var(--fg-muted)}

.checkbox-row input[type="checkbox"],
.checkbox-row input[type="radio"]{
  width:18px!important;
  min-width:18px;
  height:18px!important;
  padding:0!important;
  border-radius:5px;
}


.input-icon{position:relative;display:flex;align-items:center}
.input-icon svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--fg-subtle);pointer-events:none;z-index:2}
.input-icon input{width:100%;padding-left:40px!important}
.input-icon svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--fg-subtle);pointer-events:none;z-index:2}
.input-icon input[type="file"]{padding-left:14px!important}

/* Admin layout */
.admin-body{display:grid;grid-template-columns:240px 1fr;min-height:100vh;background:var(--bg)}
.admin-sidebar{background:#161616;border-right:1px solid var(--border);padding:0 18px 24px;display:flex;flex-direction:column;gap:6px}
.admin-sidebar .brand{font-family:var(--font-serif);font-weight:700;font-size:1.05rem;display:flex;align-items:center;gap:8px;height:66px;margin-bottom:18px;color:var(--fg)}
.admin-sidebar .brand svg{width:20px;height:20px;color:var(--gold)}
.admin-sidebar a{padding:10px 12px;border-radius:var(--radius);font-size:0.875rem;color:var(--fg-muted);transition:all 0.15s;text-decoration:none;display:flex;gap:10px;align-items:center}
.admin-sidebar a:hover{background:var(--bg-muted);color:var(--gold)}
.admin-sidebar a.active{background:var(--gold-light);color:var(--gold)}
.admin-main{display:flex;flex-direction:column}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;padding:16px 28px;border-bottom:1px solid var(--border);background:#161616}
.admin-topbar h1{font-family:var(--font-serif);font-size:1.3rem;font-weight:700;letter-spacing:-0.01em}
.admin-topbar .subtitle{font-size:0.75rem;color:var(--fg-subtle);font-weight:400;font-family:var(--font-sans)}
.admin-content{padding:32px 28px;flex:1;width:100%;max-width:var(--content-width);margin-left:auto;margin-right:auto}
.admin-content .form-stack,.admin-content fieldset,.admin-content .admin-table{width:100%;max-width:none}
.admin-panel{width:100%;background:#161616;border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.admin-panel-stack{display:grid;gap:16px;width:100%}
.admin-panel-grid{display:grid;gap:16px}
.admin-panel legend{font-weight:600;color:var(--gold);font-size:0.95rem}
.admin-panel fieldset{border:0;padding:0;margin:0}
.admin-panel > fieldset{background:transparent;border:0;padding:0;margin:0}
.admin-panel--form > .field{margin-bottom:0}
.admin-panel--form{padding:20px}
.admin-panel--muted{background:var(--bg-muted)}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:32px}
.admin-stat{background:#161616;border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.admin-stat .label{font-size:0.75rem;color:var(--fg-muted);text-transform:uppercase;letter-spacing:0.05em}
.admin-stat .value{font-family:var(--font-serif);font-size:1.8rem;color:var(--gold);font-weight:700}
.admin-table{width:100%;border-collapse:collapse;background:#161616;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.admin-table th,.admin-table td{padding:12px 14px;text-align:left;font-size:0.875rem;border-bottom:1px solid var(--border)}
.admin-table th{background:#1a1a1a;font-weight:600;color:var(--fg-muted);text-transform:uppercase;letter-spacing:0.04em;font-size:0.75rem}
.admin-table tr:last-child td{border-bottom:none}
.admin-table .actions{display:flex;gap:6px}
.badge-pill{font-size:0.6875rem;padding:2px 10px;border-radius:9999px;font-weight:600;letter-spacing:0.02em;display:inline-block}
.badge-published{background:#1a3322;color:#9bd8a1}
.badge-draft{background:#3a1f1f;color:#e89b9b}
.badge-pending{background:#3a341a;color:#e8c97a}
.badge-approved{background:#1a3322;color:#9bd8a1}
.badge-rejected{background:#3a1f1f;color:#e89b9b}
.btn-icon.copied{background:var(--gold);color:#1a1a1a;border-color:var(--gold)}
.admin-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.admin-search{padding:8px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--fg);font-size:0.875rem;min-width:240px}

/* Quick cards no dashboard */
.quick-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}
.quick-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px 16px;background:#161616;border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:var(--fg-muted);transition:all 0.2s;text-align:center;font-size:0.875rem;font-weight:500}
.quick-card svg{width:28px;height:28px;color:var(--gold)}
.quick-card:hover{background:var(--bg-muted);border-color:var(--gold);color:var(--fg);transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,0.3)}
.quick-card:hover svg{color:var(--gold)}
@media(max-width:700px){.quick-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:400px){.quick-cards{grid-template-columns:1fr}}

@media(max-width:900px){
  .admin-body{grid-template-columns:1fr}
  .admin-sidebar{flex-direction:row;overflow-x:auto;border-right:none;border-bottom:1px solid var(--border)}
  .admin-sidebar .sidebar-section{flex:0 0 auto;margin-bottom:0}
  .admin-sidebar .sidebar-label{width:auto;min-width:150px;margin-bottom:0}
  .admin-sidebar .sidebar-links{display:flex!important;max-height:none;overflow:visible;opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:none;gap:4px}
  .admin-sidebar .sidebar-chevron{display:none}
  /* scrollbar horizontal mobile */
  .admin-sidebar::-webkit-scrollbar{height:4px}
  .admin-sidebar::-webkit-scrollbar-track{background:transparent}
  .admin-sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
  .admin-sidebar::-webkit-scrollbar-thumb:hover{background:var(--gold)}
  .admin-sidebar{scrollbar-width:thin;scrollbar-color:var(--border) transparent}
}