.admin-page{background:var(--paper)}
.admin-page header nav{font-size:12px}
.admin-hero{padding-top:64px;padding-bottom:72px}
.admin-hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(52px,8vw,104px);font-weight:400;letter-spacing:-.06em;line-height:.98;margin:18px 0 0}
.admin-hero h1 em{color:var(--muted);font-style:italic}
.admin-hero>p{max-width:520px;color:var(--muted);font-size:18px;line-height:1.7;margin:30px 0 0}
.admin-workspace{padding-top:0}
.admin-login{padding-top:0}
.admin-login-card{max-width:520px;border-top:1px solid var(--line);padding-top:24px}
.admin-login-card h2{font-family:Georgia,'Times New Roman',serif;font-size:42px;font-weight:400;line-height:1.05;letter-spacing:-.05em;margin:18px 0 30px}
.admin-login-card h2 em{color:var(--muted);font-style:italic}
.admin-login-card label{display:block;font-size:13px;margin-bottom:20px}
.admin-login-card input{display:block;width:100%;border:1px solid var(--line);background:transparent;color:var(--ink);font:15px Arial,sans-serif;padding:13px 14px;margin-top:8px}
.admin-login-card input:focus{border-color:var(--ink);outline:0}
.admin-notice{border-left:2px solid var(--accent);background:var(--panel);padding:18px 20px;color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:36px}
.admin-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:7%;align-items:start}
.article-form,.admin-library{border-top:1px solid var(--line);padding-top:22px}
.form-heading,.library-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}
.form-heading>span,.admin-kicker{font:11px Arial,sans-serif;letter-spacing:.13em;color:var(--muted)}
.quiet-button{border:0;background:transparent;padding:0;color:var(--muted);font:12px Arial,sans-serif;text-decoration:underline;cursor:pointer}
.article-form label{display:block;font-size:13px;margin:0 0 22px;color:var(--ink)}
/* style.css sets `input,textarea{display:block}`, which outranks the browser's own
   [hidden] rule. Anything hidden inside the form needs this to actually disappear. */
.article-form [hidden]{display:none}
.rich-field{margin:0 0 22px}
.rich-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:8px}
.rich-head label{margin:0}
.rich-toolbar{display:flex;gap:4px}
.rich-toolbar button{min-width:30px;height:28px;padding:0 8px;border:1px solid var(--line);background:transparent;color:var(--ink);font:13px Georgia,serif;cursor:pointer;margin:0;display:inline-flex;align-items:center;justify-content:center}
.rich-toolbar button:hover{border-color:var(--ink)}
/* style.css sets `button{display:flex;width:100%}`, so every button here has to
   opt out of the full-width default explicitly. */
.form-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.form-actions .primary-button,.form-actions .ghost-button{width:auto;flex:0 0 auto}
.ghost-button{border:1px solid var(--line);background:transparent;color:var(--ink);font:12px Arial,sans-serif;letter-spacing:.06em;padding:13px 20px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.ghost-button:hover{border-color:var(--ink)}

/* Full-article preview. The inside is rendered by article-view.js and styled by
   articles.css, so it matches the published page rather than imitating it. */
.preview-overlay{position:fixed;inset:0;z-index:50;background:rgba(20,22,18,.55);display:flex;align-items:center;justify-content:center;padding:24px}
.preview-overlay[hidden]{display:none}   /* the display:flex above outranks the browser's [hidden] rule */
.preview-shell{background:var(--paper);width:min(980px,100%);max-height:100%;display:flex;flex-direction:column;box-shadow:0 18px 60px rgba(0,0,0,.3)}
.preview-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;border-bottom:1px solid var(--line);flex:0 0 auto}
.preview-bar span{font:10px Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.preview-bar button{width:auto;flex:0 0 auto;border:1px solid var(--line);background:transparent;color:var(--ink);font:11px Arial,sans-serif;letter-spacing:.08em;padding:8px 16px;cursor:pointer;display:inline-flex;align-items:center}
.preview-bar button:hover{border-color:var(--ink)}
.preview-scroll{overflow:auto;padding:34px 40px 48px;-webkit-overflow-scrolling:touch}
.preview-scroll .article-detail-inner{margin:0 auto}
@media(max-width:600px){.preview-overlay{padding:0}.preview-scroll{padding:22px 18px 34px}}

.rich-hint{font:11px Arial,sans-serif;color:var(--muted);margin:6px 0 0}
/* The formatted editing box (admin.js) stands in for each text field's
   <textarea>, which stays in the form, hidden, holding the stored markup. */
.article-form .rich-source{display:none!important}
.rich-editor{position:relative;margin-top:8px;border:1px solid var(--line);padding:13px 14px;font:15px/1.6 Arial,sans-serif;color:var(--ink);background:transparent;outline:0;overflow-wrap:anywhere;max-height:70vh;overflow:auto;cursor:text}
.rich-editor:focus{border-color:var(--ink)}
.rich-editor.invalid{border-color:#b52a20}
.rich-editor.is-empty:before{content:attr(data-placeholder);position:absolute;top:13px;left:14px;right:14px;color:var(--muted);opacity:.7;pointer-events:none}
.rich-editor p{margin:0 0 10px}.rich-editor p:last-child{margin-bottom:0}
.rich-editor h3{font:400 21px/1.3 Georgia,serif;margin:16px 0 6px}.rich-editor h3:first-child{margin-top:0}
.rich-editor ul{margin:0 0 10px;padding-left:20px}
.rich-editor strong em,.rich-editor em strong{font-weight:700}   /* see articles.css */
.rich-editor a{color:var(--ink);border-bottom:1px solid;cursor:text}
/* One ingredient or step per line: a hairline shows where each one ends. */
.rich-editor-ingredients>div+div,.rich-editor-steps>div+div{border-top:1px dotted var(--line);margin-top:4px;padding-top:4px}
.rich-editor .rich-figure{margin:14px 0;cursor:default}
/* Uncropped, so the box shows the framing the reader will actually get. */
.rich-editor .rich-figure img{display:block;max-width:100%;max-height:240px;margin:0 auto;background:var(--panel)}
.rich-editor figcaption{font:10px Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:7px}
.rich-editor .rich-inline-image{max-width:100%;max-height:140px;height:auto;vertical-align:middle}
.rich-field.dropping .rich-editor{border-color:var(--accent);background:var(--panel)}
.rich-field.dropping .rich-hint{color:var(--accent)}
.article-form label>span:not(.image-name){color:var(--muted)}
.article-form input:not([type="checkbox"]),.article-form select,.article-form textarea{font:15px Arial,sans-serif;color:var(--ink);border:1px solid var(--line);background:transparent;padding:13px 14px;min-height:0;margin-top:8px}
.article-form input:not([type="checkbox"]):focus,.article-form select:focus,.article-form textarea:focus{border-color:var(--ink);box-shadow:none}
.article-form select{appearance:auto}
.article-form textarea{resize:vertical;line-height:1.5}
.article-form .field-row{gap:18px}
.file-field input[type="file"]{display:block;border:0;padding:10px 0 4px;margin-top:3px;font-size:12px}
.file-field>span{display:block;font:11px Arial,sans-serif;color:var(--muted);margin-top:4px}
.publish-toggle{display:flex!important;align-items:center;gap:10px;font-size:13px!important;color:var(--muted)!important}
.publish-toggle input{width:16px!important;height:16px!important;margin:0!important;accent-color:var(--ink)}
/* The rule above uses display:flex!important, which would beat [hidden] too. */
.article-form .publish-toggle[hidden]{display:none!important}
.newsletter-toggle{margin-top:-10px!important}
.newsletter-sent{font-size:12.5px;line-height:1.55;color:var(--muted);margin:-10px 0 22px;border-left:2px solid var(--line);padding-left:10px}
.newsletter-count{font-size:12.5px;line-height:1.5;color:var(--muted);margin:14px 0 0}
.primary-button{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:var(--ink);color:var(--paper);font:14px Arial,sans-serif;padding:17px 18px;cursor:pointer;margin-top:6px}
.primary-button span{font-size:20px}
.form-status{min-height:20px;color:var(--muted);font-size:12px;margin:14px 0 0}
.library-heading h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:34px;margin:8px 0 0}
.library-heading>#article-count{font:30px Georgia,serif;color:var(--muted)}
.admin-list{display:flex;flex-direction:column;gap:0}
.admin-entry{border-top:1px solid var(--line);padding:17px 0;display:grid;grid-template-columns:64px 1fr;gap:14px}
.admin-entry img{width:64px;height:64px;object-fit:cover;background:var(--panel)}
.admin-entry h3{font-family:Georgia,'Times New Roman',serif;font-size:20px;line-height:1.1;margin:0 0 6px}
.admin-entry-meta{font:10px Arial,sans-serif;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.admin-entry-actions{display:flex;gap:14px;align-items:center;margin-top:9px}
.admin-entry-actions button{width:auto;background:none;border:0;padding:0;margin:0;color:var(--ink);font:11px Arial,sans-serif;text-decoration:underline;cursor:pointer}
.admin-entry-actions button.delete{color:#9a4a3d}
.admin-entry.unpublished{opacity:.55}
.admin-empty{color:var(--muted);font-size:14px;line-height:1.6;border:1px dashed var(--line);padding:26px;text-align:center}
.data-actions{border-top:1px solid var(--line);margin-top:20px;padding-top:18px;display:flex;gap:18px;flex-wrap:wrap}
.data-actions button,.import-label{border:0;background:none;color:var(--muted);font:11px Arial,sans-serif;text-decoration:underline;cursor:pointer;padding:0}
.import-label input{display:none}
@media(max-width:850px){.admin-layout{grid-template-columns:1fr;gap:50px}.admin-library{order:-1}}
@media(max-width:600px){.admin-hero{padding-top:35px;padding-bottom:50px}.admin-hero h1{font-size:58px}.admin-hero>p{font-size:16px}.article-form .field-row{grid-template-columns:1fr;gap:0}.admin-page header nav a:first-child{display:none}}

/* ---- Στατιστικά ---- */
.admin-stats{border-top:1px solid var(--line);padding-top:22px;margin:40px 0 44px}
.stats-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}
.stats-head h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:34px;margin:8px 0 0}
.stats-range{display:flex;border:1px solid var(--line)}
.stats-range button{width:auto;margin:0;padding:7px 12px;border:0;background:transparent;color:var(--muted);font:11px Arial,sans-serif;letter-spacing:.08em;cursor:pointer}
.stats-range button.active{background:var(--ink);color:var(--paper)}
.stat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px;align-items:start}
.stat-tile--lead{grid-column:span 2}
.stat-tile{border:1px solid var(--line);padding:16px 18px 14px;min-width:0}
.stat-label{display:block;font:11px/1.35 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;min-height:2.7em}
.stat-value{display:block;font:600 34px/1 Arial,sans-serif;color:var(--ink);letter-spacing:-.02em}
.stat-trend{margin-top:12px;height:34px;position:relative}
.stat-trend svg{display:block;width:100%;height:34px;overflow:visible}
.stat-trend .tip{position:absolute;top:-30px;transform:translateX(-50%);background:var(--ink);color:var(--paper);font:11px Arial,sans-serif;padding:4px 8px;white-space:nowrap;pointer-events:none;display:none}
.stats-note{font:12px Arial,sans-serif;color:var(--muted);margin:14px 0 0}
.stat-articles{margin-top:28px}
.stat-article{border-top:1px solid var(--line);padding:16px 0}
.stat-article-row{display:grid;grid-template-columns:minmax(0,1fr) 90px 90px;gap:16px;align-items:baseline}
.stat-article-row h3{font:400 18px Georgia,serif;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stat-article-row h3 .draft{font:10px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-left:8px}
.stat-num{font:600 16px Arial,sans-serif;font-variant-numeric:tabular-nums;color:var(--ink);text-align:right}
.stat-num small{display:block;font:10px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:400;margin-top:2px}
.share-links{margin:12px 0 0;padding:0;list-style:none}
.share-link{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:14px;align-items:center;padding:7px 0;font:13px Arial,sans-serif;color:var(--muted)}
.share-link code{font:12px "Courier New",monospace;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.share-link .clicks{font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.share-link button{width:auto;margin:0;padding:0;border:0;background:none;color:var(--ink);font:11px Arial,sans-serif;text-decoration:underline;cursor:pointer}
.share-link button.delete{color:#9a4a3d}
.share-add{display:flex;gap:10px;margin-top:10px}
.share-add input{flex:1;min-height:36px;padding:6px 10px;font:13px Arial,sans-serif;border:1px solid var(--line);background:transparent;color:var(--ink)}
.share-add button{width:auto;margin:0;padding:0 14px;min-height:36px;font:12px Arial,sans-serif;background:var(--ink);color:var(--paper);border:0;cursor:pointer}
.stat-empty{font:13px Arial,sans-serif;color:var(--muted);padding:18px 0;border-top:1px solid var(--line)}
@media(max-width:850px){.stat-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-tile--lead{grid-column:span 2}.stats-head{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.stat-tiles{grid-template-columns:1fr}.stat-tile--lead{grid-column:span 1}.stat-article-row{grid-template-columns:minmax(0,1fr) 70px 70px;gap:10px}.share-link{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}}

/* Newsletter report.
   Meters: fill #6a7a2c on a lighter step of the same olive (#e1e4d0). The site's
   own accent #c4cd99 is only 1.5:1 against the paper, too faint for a bar.
   Problems have one status, alert red, and always carry an icon and words, never
   colour alone (red against amber fails for colour-blind readers). */
.nl-list{margin-top:18px}
.nl-item{border-top:1px solid var(--line);padding:18px 0 20px}
.nl-item-head{display:flex;justify-content:space-between;align-items:baseline;gap:6px 16px;flex-wrap:wrap;margin-bottom:14px}
.nl-item-head h3{font:400 20px/1.3 Georgia,'Times New Roman',serif;margin:0;color:var(--ink)}
.nl-when{font:12px Arial,sans-serif;color:var(--muted)}
.nl-meters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.nl-meter{min-width:0}
.nl-meter-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.nl-meter-label{font:11px/1.3 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.nl-meter-value{font:600 22px/1 Arial,sans-serif;color:var(--ink)}
.nl-track{height:6px;background:#e1e4d0;border-radius:3px;overflow:hidden}
.nl-fill{display:block;height:100%;background:#6a7a2c;border-radius:3px}
.nl-meter-count{display:block;font:12px Arial,sans-serif;color:var(--muted);margin-top:7px;font-variant-numeric:tabular-nums}
.nl-issues{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0}
.nl-issue{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);padding:5px 10px;font:12px Arial,sans-serif;color:var(--muted)}
.nl-issue b{font-weight:600;color:var(--ink)}
.nl-issue--alert{border-color:#b52a20;color:var(--ink)}
.nl-issue--alert svg{width:13px;height:13px;flex:0 0 auto;fill:#b52a20}
.nl-message{font:13px/1.55 Arial,sans-serif;color:var(--muted);margin:0}
.nl-message--error{border-left:2px solid #b52a20;padding-left:10px;margin-bottom:14px;color:var(--ink)}
@media(max-width:700px){.nl-meters{grid-template-columns:1fr;gap:16px}}
/* The global button{width:100%} would stretch Ανανέωση across the heading row. */
.nl-report .stats-head .quiet-button{width:auto;flex:0 0 auto;display:inline-block}

/* Subscriber list */
.subs-tools{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:space-between;margin-bottom:6px}
.subs-filter{flex-wrap:wrap}
.subs-tools input{width:240px;max-width:100%;min-height:0;padding:8px 10px;border:1px solid var(--line);background:transparent;color:var(--ink);font:13px Arial,sans-serif}
.subs-list{margin-top:10px}
.subs-row{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.6fr) 96px 72px;gap:12px;align-items:baseline;padding:11px 0;border-top:1px solid var(--line);font:14px Arial,sans-serif;color:var(--ink)}
.subs-row--head{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-top:0;border-top:0}
.subs-email{overflow-wrap:anywhere}
.subs-status small{color:var(--muted);font-size:12px}
.subs-status--unsubscribed,.subs-status--pending{color:var(--muted)}
.subs-status--inactive{color:#b52a20}
.subs-date{color:var(--muted);font-variant-numeric:tabular-nums}
.subs .quiet-button{width:auto;display:inline-block;flex:0 0 auto;margin:0}
.subs-row .quiet-button{justify-self:end}
.subs-more{margin-top:14px!important}
.subs [hidden]{display:none!important}
@media(max-width:640px){
  .subs-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px}
  .subs-row--head{display:none}
  .subs-email{grid-column:1/-1}
  .subs-date{display:none}
  .subs-tools input{width:100%}
}
/* Subscriber page and the link to it */
.nl-head-actions{display:flex;align-items:baseline;gap:18px;flex:0 0 auto}
.nl-head-actions .quiet-button{margin:0}
.nl-subs-link{font:12px Arial,sans-serif;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.subs-page{padding-top:34px}
.subs-page .admin-stats{margin-top:22px}
.subs-back{display:inline-block;font:12px Arial,sans-serif;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.subs-login{border:1px solid var(--line);padding:22px;margin:28px 0;max-width:460px}
.subs-login p{margin:0 0 16px;color:var(--muted)}
.subs-login .subs-login-button{display:inline-flex;width:auto;justify-content:center;background:var(--ink);color:var(--paper);padding:12px 22px;font:14px Arial,sans-serif}
.subs-page [hidden]{display:none!important}