/* ============================================================
   The Padel Academy · admin / inline-edit engine styling
   All visual rules are gated by JS-injected classes (.pa-edit-on,
   .pa-toolbar, .pa-chip, .pa-pop, .pa-toast). Normal visitors never
   see any of this because admin.js injects nothing without a session.
   ============================================================ */

:root{
  --pa-trinidad:#E34703;
  --pa-srobus:#F78309;
  --pa-gable:#1F2528;
  --pa-gable-2:#171b1d;
  --pa-gable-3:#262d30;
  --pa-oldlace:#FDF6EE;
  --pa-cream-soft:#c3bbb0;
  --pa-line:rgba(253,246,238,.12);
  --pa-grad:linear-gradient(100deg,#E34703 0%,#F78309 100%);
  --pa-shadow:0 18px 50px -16px rgba(0,0,0,.7);
}

/* ===================== TOOLBAR ===================== */
.pa-toolbar{
  position:fixed;
  left:16px;
  bottom:16px;
  z-index:9000;
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.5rem .65rem;
  border-radius:999px;
  background:linear-gradient(180deg,var(--pa-gable-3),var(--pa-gable-2));
  border:1px solid var(--pa-line);
  box-shadow:var(--pa-shadow);
  color:var(--pa-oldlace);
  font-family:-apple-system,BlinkMacSystemFont,'Averia Serif Libre',Segoe UI,Roboto,sans-serif;
  font-size:.82rem;
  max-width:calc(100vw - 32px);
  flex-wrap:wrap;
}

.pa-toolbar__brand{
  display:flex;
  align-items:center;
  gap:.4rem;
  padding:.2rem .55rem .2rem .35rem;
  white-space:nowrap;
  color:var(--pa-cream-soft);
}
.pa-toolbar__dot{
  color:var(--pa-srobus);
  font-size:.7rem;
  line-height:1;
  filter:drop-shadow(0 0 4px rgba(247,131,9,.7));
}
.pa-toolbar__email{
  max-width:160px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.74rem;
  opacity:.85;
}

.pa-btn{
  font-family:'Beautique','Averia Serif Libre',serif;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:.72rem;
  font-weight:700;
  line-height:1;
  padding:.6rem .85rem;
  border-radius:999px;
  border:1px solid var(--pa-line);
  background:rgba(253,246,238,.04);
  color:var(--pa-oldlace);
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease,border-color .18s ease,opacity .18s ease;
  white-space:nowrap;
}
.pa-btn:hover{ border-color:var(--pa-srobus); background:rgba(247,131,9,.08); }
.pa-btn:active{ transform:translateY(1px); }

.pa-btn--primary{
  background:var(--pa-grad);
  color:#fff;
  border-color:transparent;
  box-shadow:0 10px 24px -10px rgba(227,71,3,.7);
}
.pa-btn--primary:hover{ filter:brightness(1.06); border-color:transparent; background:var(--pa-grad); }

.pa-btn[disabled]{
  opacity:.4;
  cursor:not-allowed;
  filter:grayscale(.3);
  box-shadow:none;
}
.pa-btn[disabled]:hover{ transform:none; border-color:var(--pa-line); background:rgba(253,246,238,.04); }

.pa-btn--on{
  background:var(--pa-grad);
  color:#fff;
  border-color:transparent;
  box-shadow:0 0 0 2px rgba(247,131,9,.25);
}
.pa-btn--on:hover{ background:var(--pa-grad); border-color:transparent; }

.pa-btn--ghost{ background:transparent; }

/* ===================== EDIT-MODE TEXT ===================== */
.pa-edit-on [data-edit]{
  outline:1px dashed transparent;
  outline-offset:3px;
  border-radius:3px;
  transition:outline-color .15s ease,background .15s ease;
}
.pa-edit-on [data-edit]:hover{
  outline-color:rgba(247,131,9,.6);
  background:rgba(247,131,9,.04);
}
.pa-edit-on [data-edit]:focus{
  outline:2px dashed var(--pa-srobus);
  outline-offset:3px;
  background:rgba(247,131,9,.06);
}
.pa-edit-on [data-edit]{ cursor:text; }

/* ===================== MEDIA "CHANGE" CHIP ===================== */
.pa-edit-on [data-edit-media]{ position:relative; }

.pa-chip{
  position:absolute;
  top:8px;
  right:8px;
  z-index:8500;
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  padding:.4rem .7rem;
  border-radius:999px;
  font-family:'Beautique','Averia Serif Libre',serif;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:.66rem;
  font-weight:700;
  line-height:1;
  color:#fff;
  background:var(--pa-grad);
  border:1px solid rgba(0,0,0,.2);
  box-shadow:0 8px 20px -8px rgba(0,0,0,.7);
  cursor:pointer;
  transition:transform .18s ease,filter .18s ease;
}
.pa-chip:hover{ transform:translateY(-1px); filter:brightness(1.08); }

/* ===================== MEDIA POPOVER ===================== */
.pa-pop{
  position:fixed;
  z-index:9100;
  width:min(320px,calc(100vw - 24px));
  background:linear-gradient(180deg,var(--pa-gable-3),var(--pa-gable-2));
  border:1px solid var(--pa-line);
  border-radius:16px;
  box-shadow:var(--pa-shadow);
  padding:1rem;
  color:var(--pa-oldlace);
  font-family:'Averia Serif Libre',Georgia,serif;
}
.pa-pop__title{
  font-family:'Beautique','Averia Serif Libre',serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.7rem;
  color:var(--pa-srobus);
  margin-bottom:.7rem;
}
.pa-pop__label{
  display:block;
  font-size:.66rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--pa-cream-soft);
  margin:.7rem 0 .35rem;
}
.pa-pop input[type=file],
.pa-pop input[type=text]{
  width:100%;
  font-family:inherit;
  font-size:.82rem;
  color:var(--pa-oldlace);
  background:rgba(23,27,29,.6);
  border:1px solid var(--pa-line);
  border-radius:10px;
  padding:.55rem .65rem;
}
.pa-pop input[type=text]::placeholder{ color:rgba(195,187,176,.5); }
.pa-pop input[type=text]:focus{ outline:none; border-color:var(--pa-srobus); }
.pa-pop input[type=file]{ padding:.45rem .55rem; }
.pa-pop input[type=file]::file-selector-button{
  font-family:'Beautique','Averia Serif Libre',serif;
  text-transform:uppercase;letter-spacing:.04em;font-size:.66rem;font-weight:700;
  margin-right:.6rem;padding:.4rem .6rem;border-radius:999px;border:0;cursor:pointer;
  background:var(--pa-grad);color:#fff;
}
.pa-pop__sep{
  text-align:center;
  font-size:.62rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--pa-cream-soft);
  opacity:.6;
  margin:.8rem 0 .2rem;
}
.pa-pop__actions{
  display:flex;
  gap:.5rem;
  margin-top:1rem;
}
.pa-pop__actions .pa-btn{ flex:1; text-align:center; justify-content:center; }
.pa-pop__status{
  margin-top:.7rem;
  font-size:.72rem;
  color:var(--pa-srobus);
  min-height:1em;
}

/* ===================== MEDIA PICKER (library / upload / link) ===================== */
.pa-pop--media{ width:min(360px,calc(100vw - 24px)); }
.pa-pop__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.6rem; }
.pa-pop__head .pa-pop__title{ margin:0; }
.pa-pop__x{ background:none; border:0; color:var(--pa-cream-soft); font-size:1.3rem; line-height:1; cursor:pointer; padding:.1rem .3rem; }
.pa-pop__x:hover{ color:var(--pa-srobus); }
.pa-tabs{ display:flex; gap:.3rem; margin-bottom:.7rem; }
.pa-tab{
  flex:1; font-family:'Beautique','Averia Serif Libre',serif; text-transform:uppercase;
  letter-spacing:.05em; font-size:.62rem; font-weight:700; cursor:pointer;
  padding:.45rem .4rem; border-radius:999px; border:1px solid var(--pa-line);
  background:rgba(23,27,29,.5); color:var(--pa-cream-soft);
}
.pa-tab--on{ background:var(--pa-grad); color:#fff; border-color:transparent; }
.pa-pane[hidden]{ display:none; }
.pa-pop__hint{ font-size:.66rem; color:var(--pa-cream-soft); opacity:.7; margin:.5rem 0 0; }
.pa-lib{
  display:grid; grid-template-columns:repeat(3,1fr); gap:6px;
  max-height:232px; overflow-y:auto; padding:2px;
}
.pa-lib__empty{ grid-column:1 / -1; text-align:center; font-size:.72rem; color:var(--pa-cream-soft); padding:1.5rem .5rem; }
.pa-lib__item{
  position:relative; aspect-ratio:1 / 1; border-radius:10px; overflow:hidden; cursor:pointer; padding:0;
  border:1px solid var(--pa-line); background:rgba(23,27,29,.6);
}
.pa-lib__item:hover{ border-color:var(--pa-srobus); }
.pa-lib__item img, .pa-lib__item video{ width:100%; height:100%; object-fit:cover; display:block; }
.pa-lib__badge{
  position:absolute; left:4px; bottom:4px; width:18px; height:18px; border-radius:50%;
  background:rgba(0,0,0,.6); color:#fff; font-size:.58rem; display:grid; place-items:center;
}
.pa-lib__del{
  position:absolute; top:3px; right:3px; width:18px; height:18px; border-radius:50%;
  background:rgba(0,0,0,.6); color:#fff; border:0; cursor:pointer; font-size:.9rem; line-height:1;
  display:none; place-items:center;
}
.pa-lib__item:hover .pa-lib__del{ display:grid; }
.pa-lib__del:hover{ background:#c0392b; }

/* ===================== TOAST ===================== */
.pa-toast{
  position:fixed;
  left:50%;
  bottom:24px;
  transform:translateX(-50%) translateY(8px);
  z-index:9200;
  padding:.7rem 1.1rem;
  border-radius:999px;
  background:linear-gradient(180deg,var(--pa-gable-3),var(--pa-gable-2));
  border:1px solid var(--pa-line);
  box-shadow:var(--pa-shadow);
  color:var(--pa-oldlace);
  font-family:'Averia Serif Libre',Georgia,serif;
  font-size:.82rem;
  max-width:min(440px,calc(100vw - 32px));
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;
}
.pa-toast.pa-toast--in{ opacity:1; transform:translateX(-50%) translateY(0); }
.pa-toast--error{ border-color:rgba(227,71,3,.6); }
.pa-toast--ok .pa-toast__icon{ color:var(--pa-srobus); }
.pa-toast__icon{ margin-right:.4rem; }

/* small screens: let the toolbar wrap nicely */
@media (max-width:520px){
  .pa-toolbar__email{ max-width:110px; }
}