/* MONEA Royal Monica · Consent Manager UI · estilo bubble Sol collection
   Paleta: crema + negro Monea + acento sun terracota */

/* ===== BUBBLE bottom-left ===== */
.cmp-banner{
  position:fixed;
  left:24px;
  bottom:24px;   /* default: pegada abajo */
  z-index:9998;
  width:min(380px, calc(100vw - 48px));
  background:#F5F3E9;
  color:#1D1D1B;
  border-radius:12px;
  box-shadow:0 20px 60px rgba(29,29,27,.18), 0 6px 20px rgba(29,29,27,.10);
  border:1px solid rgba(29,29,27,.08);
  overflow:hidden;
  transform:translateY(20px) scale(.96);
  opacity:0;
  transition:transform .4s cubic-bezier(.2,.7,.2,1), opacity .35s ease, bottom .35s cubic-bezier(.2,.7,.2,1);
  font-family:'Inter',-apple-system,sans-serif;
}
.cmp-banner.is-visible{ transform:translateY(0) scale(1); opacity:1; }
/* Cuando la book-sticky es visible → bubble sube para no taparla */
.cmp-banner.cmp-banner--lifted{ bottom:96px; }

/* Línea acento sun arriba */
.cmp-banner:before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:linear-gradient(90deg, #5C2A1F 0%, #C9794D 50%, #E6D6BA 100%);
}

.cmp-banner__inner{
  padding:1.5rem 1.6rem 1.3rem;
  position:relative;
}

.cmp-banner__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:rgba(200,118,60,.10);
  margin-bottom:.9rem;
}
.cmp-banner__icon svg{ display:block; width:20px; height:20px; }

.cmp-banner__title{
  font-family:'Libre Caslon Text', Georgia, serif;
  font-size:1.35rem;
  font-weight:400;
  line-height:1.15;
  margin:0 0 .55rem;
  color:#1D1D1B;
  letter-spacing:-.005em;
}
.cmp-banner__title em{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-style:italic;
  font-weight:400;
  color:#5C2A1F;
}

.cmp-banner__text{
  margin:0 0 1.2rem;
  font-size:.84rem;
  line-height:1.55;
  color:rgba(29,29,27,.72);
}
.cmp-banner__text a{
  color:#1D1D1B;
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
}
.cmp-banner__text a:hover{ color:#5C2A1F; }

.cmp-banner__actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.5rem;
  align-items:stretch;
}
.cmp-banner__actions .cmp-btn{ width:100%; text-align:center; }

/* Botones */
.cmp-btn{
  font-family:inherit;
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:.72rem 1.1rem;
  border-radius:6px;
  cursor:pointer;
  border:1px solid #1D1D1B;
  background:transparent;
  color:#1D1D1B;
  transition:background .18s ease, color .18s ease, transform .12s ease;
  white-space:nowrap;
}
.cmp-btn:hover{ background:#1D1D1B; color:#F5F3E9; }
.cmp-btn:active{ transform:translateY(1px); }
.cmp-btn--primary{ background:#1D1D1B; color:#F5F3E9; }
.cmp-btn--primary:hover{ background:#000; color:#F5F3E9; }
.cmp-btn--ghost{ background:transparent; }
.cmp-btn--text{
  border:0;
  background:transparent;
  padding:.72rem .4rem;
  font-weight:500;
  letter-spacing:.04em;
  text-transform:none;
  font-size:.8rem;
  text-decoration:underline;
  text-underline-offset:3px;
  color:rgba(29,29,27,.7);
}
.cmp-btn--text:hover{ color:#1D1D1B; background:transparent; }
.cmp-btn--block{ flex:1 1 100%; }

/* ===== PANEL modal (configurar) ===== */
.cmp-panel{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  font-family:'Inter',-apple-system,sans-serif;
}
.cmp-panel.is-visible{ opacity:1; pointer-events:auto; }

.cmp-panel__backdrop{
  position:absolute;
  inset:0;
  background:rgba(29,29,27,.55);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.cmp-panel__sheet{
  position:relative;
  background:#F5F3E9;
  color:#1D1D1B;
  width:min(620px, calc(100% - 2rem));
  max-height:calc(100vh - 2rem);
  overflow:hidden;
  border-radius:14px;
  box-shadow:0 30px 80px rgba(29,29,27,.45);
  display:flex;
  flex-direction:column;
}
.cmp-panel__sheet:before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:linear-gradient(90deg, #5C2A1F 0%, #C9794D 50%, #E6D6BA 100%);
}

.cmp-panel__header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:1.6rem 1.8rem 1.2rem;
  border-bottom:1px solid rgba(29,29,27,.08);
}
.cmp-panel__header h2{
  margin:0;
  font-family:'Libre Caslon Text', Georgia, serif;
  font-size:1.5rem;
  font-weight:400;
  letter-spacing:-.005em;
  line-height:1.2;
}
.cmp-panel__header h2 em{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-style:italic;
  color:#5C2A1F;
}
.cmp-panel__close{
  background:transparent;
  border:0;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
  color:rgba(29,29,27,.6);
  padding:0;
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .15s ease;
}
.cmp-panel__close:hover{ color:#1D1D1B; }

.cmp-panel__body{
  padding:1.4rem 1.8rem;
  overflow:auto;
}
.cmp-panel__intro{
  font-size:.85rem;
  color:rgba(29,29,27,.72);
  margin:0 0 1.4rem;
  line-height:1.6;
}

.cmp-panel__foot{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  padding:1.2rem 1.8rem;
  border-top:1px solid rgba(29,29,27,.08);
  background:rgba(29,29,27,.025);
}
.cmp-panel__foot .cmp-btn{ flex:1 1 auto; }

/* Filas categoria */
.cmp-row{
  padding:1rem 0;
  border-top:1px solid rgba(29,29,27,.08);
}
.cmp-row:first-child{ border-top:0; padding-top:.4rem; }
.cmp-row__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
}
.cmp-row__head strong{
  font-size:.95rem;
  font-weight:500;
  letter-spacing:.005em;
}
.cmp-row__desc{
  margin:.5rem 0 0;
  font-size:.8rem;
  color:rgba(29,29,27,.7);
  line-height:1.55;
}
.cmp-row__state{
  font-size:.68rem;
  color:rgba(29,29,27,.55);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:500;
}
.cmp-row__state--locked{
  padding:.25rem .55rem;
  border:1px solid rgba(29,29,27,.18);
  border-radius:4px;
  background:rgba(29,29,27,.03);
}

/* Switch */
.cmp-switch{
  position:relative;
  display:inline-block;
  width:42px;
  height:24px;
  flex-shrink:0;
}
.cmp-switch input{ opacity:0; width:0; height:0; }
.cmp-switch span{
  position:absolute;
  inset:0;
  cursor:pointer;
  background:rgba(29,29,27,.16);
  transition:background .2s;
  border-radius:999px;
}
.cmp-switch span:before{
  content:"";
  position:absolute;
  width:18px;
  height:18px;
  left:3px;
  top:3px;
  background:#F5F3E9;
  transition:transform .22s cubic-bezier(.2,.7,.2,1);
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.cmp-switch input:checked + span{ background:#5C2A1F; }
.cmp-switch input:checked + span:before{ transform:translateX(18px); }
.cmp-switch input:focus-visible + span{ outline:2px solid #5C2A1F; outline-offset:2px; }

body.cmp-lock{ overflow:hidden; }

/* ===== Responsive ===== */
@media (max-width: 720px){
  .cmp-banner{
    left:12px;
    right:12px;
    bottom:24px;   /* default pegado abajo (con margen 24 para que respire) */
    width:auto;
  }
  /* En mobile la book-sticky es la pildora "Reservar ahora" (~75px alto) */
  .cmp-banner.cmp-banner--lifted{ bottom:88px; }
  .cmp-banner__inner{ padding:1.2rem 1.2rem 1rem; }
  .cmp-banner__title{ font-size:1.15rem; }
  /* Aceptar / Rechazar siguen en grid 2 cols, NO se apilan */
  .cmp-panel__foot{ flex-direction:column-reverse; }
  .cmp-panel__foot .cmp-btn{ width:100%; }
  .cmp-panel__sheet{ border-radius:14px 14px 0 0; max-height:90vh; }
  .cmp-panel{ align-items:flex-end; }
}