/* Inline admin — WYSIWYG: page looks normal until a block is selected */

.admin-mode .block-editable{
  outline:none;
  position:relative;
  border-radius:inherit;
}
.admin-mode .block-editable:hover{
  outline:1px solid color-mix(in srgb,var(--as-accent) 22%,transparent);
  outline-offset:3px;
}
.admin-mode .block-editable.is-selected{
  outline:2px solid color-mix(in srgb,var(--as-accent) 65%,transparent);
  outline-offset:4px;
}

.admin-mode .block-toolbar{
  display:none;
  position:absolute;
  z-index:60;
  top:0;
  right:0;
  transform:translateY(calc(-100% - 6px));
  flex-wrap:wrap;
  gap:.25rem;
  max-width:min(100%,320px);
  padding:.35rem;
  margin:0;
  border-radius:12px;
  background:color-mix(in srgb,var(--as-bg) 92%,transparent);
  border:1px solid color-mix(in srgb,var(--as-text) 14%,transparent);
  box-shadow:0 12px 40px rgba(0,0,0,.35);
  backdrop-filter:blur(12px);
}
.admin-mode .block-editable.is-selected .block-toolbar{
  display:flex;
}

.block-toolbar button{
  font-size:.68rem;padding:.35rem .5rem;border-radius:8px;
  border:1px solid color-mix(in srgb,var(--as-text) 16%,transparent);
  background:color-mix(in srgb,var(--as-text) 5%,transparent);
  color:inherit;cursor:pointer;white-space:nowrap;
}
.block-toolbar button:hover{background:color-mix(in srgb,var(--as-accent) 18%,transparent)}
.block-toolbar button[data-block-action="delete"]{border-color:color-mix(in srgb,#f87171 40%,transparent)}

.admin-mode .block-editable .block-text,
.admin-mode .block-editable .block-figure{
  cursor:pointer;
}

.admin-canvas-zone{
  position:relative;
  min-height:2rem;
}
.admin-mode .admin-canvas-zone--empty{
  min-height:3rem;
  margin-block:.5rem;
  border-radius:12px;
  border:1px dashed color-mix(in srgb,var(--as-text) 12%,transparent);
  display:grid;
  place-items:center;
}
.admin-mode .admin-canvas-zone--empty::after{
  content:attr(data-empty-hint);
  font-size:.85rem;opacity:.45;pointer-events:none;padding:1rem;text-align:center;
}

.admin-add-menu{
  position:fixed;z-index:100;
  padding:.35rem;
  border-radius:12px;
  background:var(--as-bg);
  border:1px solid color-mix(in srgb,var(--as-text) 14%,transparent);
  box-shadow:0 16px 48px rgba(0,0,0,.4);
  display:flex;flex-direction:column;gap:.25rem;min-width:10rem;
}
.admin-add-menu[hidden]{display:none!important}
.admin-add-menu button{
  text-align:left;padding:.5rem .75rem;border:none;border-radius:8px;
  background:transparent;color:inherit;cursor:pointer;font-size:.88rem;
}
.admin-add-menu button:hover{background:color-mix(in srgb,var(--as-accent) 12%,transparent)}

.admin-edit-banner{
  position:fixed;top:0;left:0;right:0;z-index:90;height:2rem;box-sizing:border-box;
  display:flex;align-items:center;justify-content:center;gap:1rem;
  padding:0 .5rem 0 1rem;font:500 .75rem/1.2 system-ui,sans-serif;color:var(--as-text);
  background:color-mix(in srgb,var(--as-accent) 18%,var(--as-bg));
  border-bottom:1px solid color-mix(in srgb,var(--as-accent) 25%,transparent);
}
.admin-edit-banner__text{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.admin-edit-banner__actions{display:flex;align-items:center;gap:.35rem;flex-shrink:0;margin-left:auto}
.admin-edit-banner__actions form{margin:0}
.admin-edit-banner__actions a,.admin-edit-banner__actions button{
  display:inline-flex;align-items:center;height:1.5rem;padding:0 .7rem;border-radius:999px;
  font:600 .72rem/1 system-ui,sans-serif;color:inherit;text-decoration:none;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--as-text) 25%,transparent);background:color-mix(in srgb,var(--as-bg) 60%,transparent);
}
.admin-edit-banner__actions a:hover,.admin-edit-banner__actions button:hover{background:color-mix(in srgb,var(--as-accent) 30%,var(--as-bg))}
@media (min-width:900px){.admin-edit-banner__text{margin-left:auto}}
@media (max-width:640px){.admin-edit-banner__text{font-size:.68rem}}
body.admin-mode.has-edit-banner{padding-top:2rem}
body.admin-mode.has-edit-banner .site-header{top:2rem}
body.admin-mode.has-edit-banner .tv-room{top:2rem}
body.admin-mode.has-edit-banner .tv__scroll .site-header{top:0}

.admin-mode .admin-text{
  position:relative;z-index:3;pointer-events:auto;user-select:text;cursor:text;
  border-radius:3px;transition:outline-color .15s;
  outline:1px dashed transparent;outline-offset:3px;
}
.admin-mode .admin-text:hover{outline-color:color-mix(in srgb,var(--as-accent) 70%,transparent)}
.admin-mode .admin-text.is-editing{outline:2px solid var(--as-accent);background:color-mix(in srgb,var(--as-bg) 55%,transparent)}
.admin-text-hint{
  position:fixed;z-index:120;max-width:340px;padding:.45rem .65rem;border-radius:8px;
  font:500 .78rem/1.35 system-ui,sans-serif;background:#111;color:#f5f5f5;box-shadow:0 8px 24px rgba(0,0,0,.4);
}
.admin-mode .admin-text:empty::before{content:'+ add text';opacity:.45;font-size:.85em}

/* ---------- Media editing (gear, travel, uploads) ---------- */
.admin-media-field{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:1rem;align-items:start;margin-bottom:.5rem}
@media (max-width:520px){.admin-media-field{grid-template-columns:1fr}}
.admin-media-preview{aspect-ratio:4/3;border-radius:10px;overflow:hidden;display:grid;place-items:center;
  background:repeating-conic-gradient(color-mix(in srgb,var(--as-text) 8%,transparent) 0 25%,transparent 0 50%) 0 0/16px 16px;
  border:1px solid var(--as-line);font-size:.8rem;color:var(--as-muted)}
.admin-media-preview img{width:100%;height:100%;object-fit:contain;background:#000}
.admin-file-btn{position:relative;cursor:pointer}
.admin-file-btn:focus-within{outline:3px solid var(--as-accent);outline-offset:2px}
.admin-size-hint{margin:.6rem 0 0;font-size:.8rem;line-height:1.5;color:var(--as-muted)}
.admin-upload-note{margin:.5rem 0 0;font-size:.82rem;min-height:1em}
.admin-upload-note.is-warn,.photo-manager__status.is-warn{color:#f59e0b}
.admin-modal-actions{flex-wrap:wrap;align-items:center}
.admin-modal-spacer{flex:1}
.admin-modal-actions [data-close]{min-height:40px;padding:0 1rem;border-radius:999px;border:1px solid var(--as-line);background:transparent;color:inherit;cursor:pointer}
.admin-danger{color:#f87171!important;border-color:color-mix(in srgb,#f87171 55%,transparent)!important}
.admin-modal textarea{min-height:5rem}

.gear-admin-edit{
  position:absolute;top:.6rem;right:.6rem;z-index:4;display:inline-flex;align-items:center;gap:.3rem;
  padding:.4rem .75rem;border-radius:999px;border:1px solid rgba(255,255,255,.5);cursor:pointer;
  background:rgba(0,0,0,.6);color:#fff;font:600 .78rem/1 system-ui,sans-serif;backdrop-filter:blur(6px);
}
.gear-admin-edit:hover,.gear-admin-edit:focus-visible{background:var(--as-accent);color:var(--as-accent-ink,#000)}
.admin-mode .gear-spotlight__slide img{cursor:pointer}
.gear-spotlight__thumb--add{
  display:grid;place-items:center;opacity:1;font:300 2rem/1 system-ui,sans-serif;color:var(--as-accent);
  background:color-mix(in srgb,var(--as-accent) 10%,transparent);border:2px dashed color-mix(in srgb,var(--as-accent) 60%,transparent);
}
.gear-spotlight__thumb--add:hover{background:color-mix(in srgb,var(--as-accent) 22%,transparent)}
.gear-editorial__cell--add{
  display:flex;align-items:center;justify-content:center;gap:.5rem;font:600 1rem/1.2 system-ui,sans-serif;color:var(--as-accent);
  background:color-mix(in srgb,var(--as-accent) 8%,transparent);border:2px dashed color-mix(in srgb,var(--as-accent) 55%,transparent);
}
.gear-editorial__cell--add span{font-size:2rem;font-weight:300}

.photo-manager__thumb{position:relative}
.photo-manager__badge{position:absolute;left:.4rem;top:.4rem;padding:.2rem .55rem;border-radius:999px;font:700 .72rem/1.2 system-ui,sans-serif;background:var(--as-accent);color:var(--as-accent-ink,#000)}
.photo-manager__item.is-cover{border-color:var(--as-accent)}
.photo-manager__help{margin:0 0 1rem;font-size:.9rem}
.photo-manager__help summary{cursor:pointer;font-weight:600}
.photo-manager__help ul{margin:.5rem 0 0;padding-left:1.2rem;line-height:1.55;color:var(--as-muted)}
.photo-manager__info{margin-top:2rem;display:grid;gap:.75rem;max-width:48rem}
.photo-manager__info h3{margin:0;font-size:1.05rem}
.photo-manager__info label{display:grid;gap:.3rem;font-size:.85rem;color:var(--as-muted)}
.photo-manager__info input,.photo-manager__info textarea{padding:.55rem .65rem;border:1px solid var(--as-line);border-radius:8px;background:var(--as-bg);color:var(--as-text);font:inherit;line-height:1.5}
.photo-manager__info .btn{justify-self:start}

.highlight--add{display:flex}
.highlight__add{
  flex:1;min-height:16rem;display:grid;place-content:center;justify-items:center;gap:.35rem;cursor:pointer;
  border-radius:var(--as-radius-lg,18px);border:2px dashed color-mix(in srgb,var(--as-accent) 55%,transparent);
  background:color-mix(in srgb,var(--as-accent) 6%,transparent);color:inherit;font:inherit;
}
.highlight__add:hover{background:color-mix(in srgb,var(--as-accent) 14%,transparent)}
.highlight__add-plus{font-size:3rem;line-height:1;color:var(--as-accent)}
.highlight__add small{color:var(--as-muted)}

.shelf-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 .75rem}
.shelf-form-grid .shelf-form-wide{grid-column:1/-1}
@media (max-width:560px){.shelf-form-grid{grid-template-columns:1fr 1fr}.shelf-form-grid label:last-child{grid-column:1/-1}}
.shelf-form-h{margin:1.1rem 0 .4rem;font-size:.95rem}

/* ---------- Rich text toolbar ---------- */
.rte-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;padding:.4rem;margin:0 0 .5rem;border-radius:10px;
  font:500 .8rem/1.2 system-ui,sans-serif;background:#161616;color:#f3f3f3;border:1px solid #333}
.rte-bar--float{position:fixed;z-index:130;max-width:min(40rem,calc(100vw - 16px));margin:0;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.rte-bar button,.rte-bar select{font:inherit;color:inherit;background:#262626;border:1px solid #3c3c3c;border-radius:6px;padding:.3rem .5rem;min-height:2rem;cursor:pointer}
.rte-bar select{max-width:11rem}
.rte-bar button:hover:not(:disabled),.rte-bar select:hover{background:#333}
.rte-bar button:disabled{opacity:.45;cursor:not-allowed}
.rte-bar .rte-save{background:var(--as-accent,#e11);border-color:transparent;color:#fff;font-weight:700}
.rte-sep{width:1px;align-self:stretch;background:#3c3c3c;margin:0 .15rem}
.rte-current{margin-left:auto;padding:0 .3rem;color:#a3a3a3;font-size:.72rem;white-space:nowrap}
.rte-bar .admin-text-hint{position:static;flex-basis:100%;max-width:none;padding:.2rem .3rem 0;box-shadow:none;background:none;color:#a3a3a3;font-size:.72rem}
.admin-modal .rte-bar{background:color-mix(in srgb,var(--as-text) 8%,var(--as-bg));color:var(--as-text);border-color:var(--as-line)}
.admin-modal .rte-bar button,.admin-modal .rte-bar select{background:var(--as-bg);border-color:var(--as-line)}
.rte-link-back{z-index:140}
.rte-link-modal{max-width:30rem}
.rte-link-chip{position:fixed;z-index:125;padding:.25rem .55rem;border-radius:999px;border:0;cursor:pointer;
  font:600 .72rem/1.2 system-ui,sans-serif;background:#111;color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.rte-link-chip:hover{background:var(--as-accent,#e11)}

/* ---------- Visited countries ---------- */
.admin-mode [data-country-edit]{cursor:pointer}
.admin-mode [data-country-edit]:focus-visible{outline:3px solid var(--as-accent);outline-offset:2px}
.country-card--add{
  justify-content:center;font:inherit;font-weight:600;color:inherit;cursor:pointer;min-height:4.4rem;
  border:2px dashed color-mix(in srgb,var(--as-accent) 55%,transparent)!important;
  background:color-mix(in srgb,var(--as-accent) 7%,transparent)!important;
}
.country-card--add span{font-size:1.6rem;font-weight:300;line-height:1;color:var(--as-accent)}
.country-admin-hint{margin-top:1rem}
.country-form-row{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:.75rem}
@media (max-width:480px){.country-form-row{grid-template-columns:1fr}}

/* Fixed-ratio crop dialog (travel cover → 4:3 card) */
.cropper{text-align:center;background:#0d0d0f;border-radius:10px;padding:.5rem;margin:.75rem 0}
.cropper__frame{position:relative;display:inline-block;line-height:0;overflow:hidden;user-select:none;touch-action:none;max-width:100%}
.cropper__frame img{display:block;max-width:100%;max-height:58vh;width:auto;height:auto}
.cropper__box{
  position:absolute;cursor:move;border:2px solid #fff;box-shadow:0 0 0 9999px rgba(0,0,0,.58);
  background-image:linear-gradient(rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.35) 1px,transparent 1px);
  background-size:33.333% 33.333%;background-position:-1px -1px;
}
.cropper__box:focus-visible{outline:3px solid var(--as-accent,#4da3ff);outline-offset:2px}