/* ============================================================
   Sarisara Itinerary Builder — REDESIGN (scoped under .aib-redesign)
   Additive layer. Ports the approved mockup UI onto the real builder
   WITHOUT changing any markup hooks or JS behaviour.
   Step 1: base tokens + HOTEL service component.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&display=swap');

.aib-redesign{
  --bg:#f4f4f2; --card:#ffffff; --ink:#1a1a1d; --ink-soft:#3a3a40; --muted:#6a6a73; --faint:#9a9aa3;
  --line:#e8e8e6; --line-2:#dcdcd9; --field-bg:#fafafa;
  --violet:#7700FF; --violet-700:#6300d6; --violet-tint:#f3ecff;
  --black:#090920; --black-700:#1a1a33;
  /* SERVICE COLOURS = PARTNER COLOURS (13 September 2026).
     These used to be a private set — a blue hotel and a green activity — which
     meant the same partner was one colour in the builder and another on the
     payout screen. They now mirror sarisara_partner_type_colour() in
     inc/partner-identity/partner-identity.php exactly. Change that map first;
     these follow it. */
  --hotel:#0050d8; --hotel-tint:#E4EEFB;   /* hotel — the bed icon */
  --homestay:#1F8A00; --homestay-tint:#E8F4E4; /* home stay — the house icon */
  --act:#3C6B52;   --act-tint:#DCEBE1;     /* activity host — green (Chiran, 23 Oct 2026: "it should be green, light green"; same #3C6B52 as Sarisara_Payout_Partner_Types), was gold #8A6300 */
  --cur:#4A00A0;   --cur-tint:#EFE6FA;     /* local expert */
  --transport:#090920; --transport-tint:#E7E7EC; /* tour driver */
  --custom:#9a4f43; --custom-tint:#f4ebe9; /* no partner owns a custom service */
  --danger:#b3261e; --danger-tint:#fbecea;
  --radius:16px; --radius-sm:11px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(20,20,30,.04);
  --shadow:0 4px 18px -8px rgba(20,20,30,.10);
  --t:.16s ease;
  font-family:'Google Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink);
}

/* ---------- HOTEL service component ---------- */
.aib-redesign .service-component.t-hotel{
  position:relative; background:var(--card);
  border:1px solid var(--line) !important; border-radius:var(--radius-sm) !important;
  margin-bottom:11px; overflow:hidden; box-shadow:var(--shadow-sm);
  transition:box-shadow var(--t), border-color var(--t);
}
.aib-redesign .service-component.t-hotel::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--hotel); z-index:1;
}
.aib-redesign .service-component.t-hotel:hover{ box-shadow:var(--shadow); }
/* OPEN = not collapsed → full type-coloured frame (clean, no black) */
.aib-redesign .service-component.t-hotel:not(.collapsed){ border:1.5px solid var(--hotel) !important; box-shadow:var(--shadow); }

/* ----- header (override the old grid layout: display:grid !important etc.) ----- */
.aib-redesign .service-component.t-hotel .service-header{
  display:flex !important; align-items:center !important; gap:13px;
  grid-template-columns:none !important; grid-template-rows:none !important;
  height:auto !important; min-height:0 !important; width:auto !important; margin:0 !important;
  border:0 !important; box-shadow:none !important; background:#fff;
  padding:13px 14px 13px 16px; cursor:pointer; transition:var(--t); box-sizing:border-box;
}
.aib-redesign .service-component.t-hotel .service-header:hover{ background:var(--field-bg); }
/* open header: soft blue gradient that blends into the white body (beats old #fff !important) */
.aib-redesign .service-component.t-hotel:not(.collapsed) .service-header{
  background:linear-gradient(180deg,#d4e4fb 0%,var(--hotel-tint) 45%,#ffffff 100%) !important;
}

/* chevron (reuses .collapse-service-btn) — reset old grid/absolute placement */
.aib-redesign .service-component.t-hotel .collapse-service-btn{
  order:0 !important; grid-column:auto !important; grid-row:auto !important;
  position:static !important; width:28px !important; height:28px !important; flex:none;
  padding:0 !important; margin:0 !important;
  border:1px solid var(--line-2) !important; background:#fff !important; border-radius:8px !important;
  border-bottom:1px solid var(--line-2) !important;
  display:grid !important; place-items:center; color:var(--faint); cursor:pointer;
  transition:transform var(--t), color var(--t), border-color var(--t); box-shadow:none;
}
.aib-redesign .service-component.t-hotel .service-header:hover .collapse-service-btn{ border-color:var(--ink); color:var(--ink); }
.aib-redesign .service-component.t-hotel:not(.collapsed) .collapse-service-btn{
  color:var(--hotel) !important; border-color:var(--hotel) !important;
}
/* rotate the glyph itself (collapsed = down ▼, expanded = up ▲) — explicit both states to beat the base 180 */
.aib-redesign .service-component.service-hotel.t-hotel .collapse-service-btn .svgico{ transition:transform .16s ease; }
.aib-redesign .service-component.service-hotel.t-hotel.collapsed .collapse-service-btn .svgico{ transform:rotate(0deg) !important; }
.aib-redesign .service-component.service-hotel.t-hotel:not(.collapsed) .collapse-service-btn .svgico{ transform:rotate(180deg) !important; }
.aib-redesign .service-component.t-hotel .collapse-service-btn .svgico{ width:16px; height:16px; }

/* type tile */
.aib-redesign .svc-tile{
  width:44px; height:44px; border-radius:10px; flex:none; display:grid; place-items:center;
  background:var(--hotel-tint); color:var(--hotel);
}
.aib-redesign .svc-tile .svgico{ width:22px; height:22px; }

/* title column */
.aib-redesign .service-component.t-hotel .service-title-column{ flex:1; min-width:0; display:block; }
.aib-redesign .svc-type-label{
  font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--hotel); margin-bottom:2px;
}
.aib-redesign .service-component.t-hotel .service-title-name{
  font-weight:700; font-size:15px; letter-spacing:-.01em; color:var(--ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.3;
}
.aib-redesign .service-component.t-hotel .service-title-location{
  color:var(--muted); font-size:12.5px; margin-top:2px;
}

/* right cluster — reset old grid placement */
.aib-redesign .svc-header-right{ display:flex !important; align-items:center; gap:12px; flex:none; }
.aib-redesign .service-component.t-hotel .service-datetime-col{
  display:flex !important; align-items:center; gap:8px; flex:none; flex-direction:row !important;
  grid-column:auto !important; grid-row:auto !important; border:0 !important; padding:0 !important; margin:0 !important;
}
.aib-redesign .service-component.t-hotel .service-title-column{
  grid-column:auto !important; grid-row:auto !important; border:0 !important;
}

/* date / time chips */
.aib-redesign .dt-chip{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--line-2); border-radius:var(--radius-pill);
  padding:5px 11px; font-size:12.5px; font-weight:600; color:var(--ink-soft);
  background:#fff; transition:var(--t); white-space:nowrap;
}
.aib-redesign .dt-chip .dt-ico{ font-size:14px; width:14px; height:14px; line-height:14px; color:var(--faint); }
.aib-redesign .dt-chip .service-date-input,
.aib-redesign .dt-chip .service-time-input{
  border:0; background:transparent; font:inherit; color:inherit; padding:0; width:0; height:0;
  opacity:0; position:absolute; pointer-events:none;
}
/* when the JS reveals the input for editing, make it usable again */
.aib-redesign .dt-chip .service-date-input[style*="inline"],
.aib-redesign .dt-chip .service-time-input[style*="block"],
.aib-redesign .dt-chip .service-date-input[style*="block"],
.aib-redesign .dt-chip .service-time-input[style*="inline"]{
  position:static; width:auto; height:auto; opacity:1; pointer-events:auto; min-width:120px;
}
.aib-redesign .dt-chip .service-date-display,
.aib-redesign .dt-chip .service-time-display{ color:var(--ink-soft); }
.aib-redesign .dt-chip .service-date-placeholder,
.aib-redesign .dt-chip .service-time-placeholder{ color:var(--faint); }
.aib-redesign .dt-chip .service-date-edit-icon,
.aib-redesign .dt-chip .service-time-edit-icon{
  font-size:13px; width:13px; height:13px; line-height:13px; color:var(--faint); cursor:pointer;
}
.aib-redesign .dt-chip:hover{ border-color:var(--hotel); color:var(--hotel); }
.aib-redesign .dt-chip:hover .dt-ico,
.aib-redesign .dt-chip:hover .service-date-edit-icon,
.aib-redesign .dt-chip:hover .service-time-edit-icon{ color:var(--hotel); }

/* price — reset old grid placement + border */
.aib-redesign .service-component.t-hotel .service-price-display{
  grid-column:auto !important; grid-row:auto !important; border:0 !important;
  display:block !important; text-align:right; flex:none; font-size:12px; color:var(--muted); font-weight:600;
  min-width:60px; line-height:1.2; padding:0 !important; white-space:nowrap;
}
.aib-redesign .service-component.t-hotel .service-price-value{ font-size:15px; font-weight:700; color:var(--ink); }

/* delete — reset old grid placement */
.aib-redesign .service-component.t-hotel .delete-service-btn{
  grid-column:auto !important; grid-row:auto !important; position:static !important;
  width:32px !important; height:32px !important; flex:none; padding:0 !important; margin:0 !important;
  border:1px solid var(--line) !important; background:#fff !important; border-radius:9px !important;
  display:grid !important; place-items:center; color:var(--muted); cursor:pointer; transition:var(--t); box-shadow:none;
}
.aib-redesign .service-component.t-hotel .delete-service-btn:hover{
  color:var(--danger); border-color:#e7c4c0; background:var(--danger-tint);
}
.aib-redesign .service-component.t-hotel .delete-service-btn .svgico{ width:17px; height:17px; }

/* ----- body ----- */
.aib-redesign .service-component.t-hotel.collapsed .service-body{ display:none; }
.aib-redesign .service-component.t-hotel .service-body{ padding:14px 16px 16px; }
.aib-redesign .service-component.t-hotel .service-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:13px; }
.aib-redesign .service-component.t-hotel .service-field > label{
  font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em;
}
.aib-redesign .service-component.t-hotel .service-title-input{
  border:1px solid var(--line-2); border-radius:10px; padding:10px 12px; font-size:14px; font-family:inherit;
  outline:none; background:#fff; color:var(--ink); width:100%;
}
.aib-redesign .service-component.t-hotel .service-title-input:focus{ border-color:var(--hotel); box-shadow:0 0 0 3px var(--hotel-tint); }
/* the duplicate name/location display row is redundant now — hide it for the new look */
.aib-redesign .service-component.t-hotel .hotel-display-row{ display:none; }

/* ----- room table ----- */
/* clear gap between the Title field and the room table; drop the duplicate "ROOM TYPES" heading */
.aib-redesign .room-types-section{ margin:0; }
.aib-redesign .room-types-section > h5{ display:none !important; }
.aib-redesign .room-types-table{
  width:100%; border-collapse:collapse; border:1px solid var(--line); border-radius:10px; overflow:hidden;
  font-size:13px; background:#fff;
}
.aib-redesign .room-types-table thead th{
  background:var(--field-bg); font-size:10.5px; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:.04em; padding:9px 8px; text-align:center; border:0;
}
.aib-redesign .room-types-table thead th:first-child{ text-align:left; padding-left:13px; }
.aib-redesign .room-types-table tbody td{
  border-top:1px solid var(--line); padding:8px; text-align:center; vertical-align:middle;
}
.aib-redesign .room-types-table tbody td:first-child{ text-align:left; padding-left:13px; font-weight:600; }
.aib-redesign .room-types-table .room-type-input{
  border:1px solid var(--line-2); border-radius:8px; padding:6px 8px; font-size:13px; font-family:inherit;
  text-align:center; outline:none; background:#fff; color:var(--ink); max-width:74px;
}
.aib-redesign .room-types-table .room-type-input[readonly]{ background:var(--field-bg); color:var(--ink-soft); }
.aib-redesign .room-types-table .room-type-input:focus{ border-color:var(--hotel); box-shadow:0 0 0 3px var(--hotel-tint); }
.aib-redesign .room-types-table select.room-type-input{ max-width:none; }
.aib-redesign .room-types-table .room-type-select{ accent-color:var(--hotel); margin-right:7px; }
.aib-redesign .room-types-table .room-total{ font-weight:700; color:var(--ink); }
/* NO row highlight in the builder — the blue "selected" state belongs to the
   traveller PREVIEW only (engine-picked room). Builder rows stay white. */
.aib-redesign .room-types-table .room-type-row{ background:#fff !important; }
/* safety: no black cell borders anywhere in the room table (old CSS used #030213/#000) */
.aib-redesign .room-types-table,
.aib-redesign .room-types-table th,
.aib-redesign .room-types-table td,
.aib-redesign .room-types-table .room-extra-bed-cell{ border-color:var(--line) !important; }

/* ---------- parity additions (match the mockup) ---------- */
/* sub-line: location icon + hotel class stars */
.aib-redesign .service-component.t-hotel .service-title-location{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.aib-redesign .svc-loc-icon{ font-size:14px; width:14px; height:14px; line-height:14px; color:var(--faint); }
.aib-redesign .hclass{ color:#caa53e; font-weight:600; letter-spacing:1px; display:inline-flex; align-items:center; }
.aib-redesign .hclass i{ color:var(--muted); font-style:normal; font-weight:600; margin-left:5px; font-size:11.5px; letter-spacing:0; }

/* header price → "from $X /night" (numeric total kept but hidden for functional reads) */
.aib-redesign .service-component.t-hotel .service-price-total{ display:none !important; }
.aib-redesign .service-component.t-hotel .svc-rate-ref{ display:block; text-align:right; font-size:15px; font-weight:700; color:var(--ink); white-space:nowrap; }
.aib-redesign .service-component.t-hotel .svc-rate-ref small{ display:block; font-size:11px; font-weight:500; color:var(--muted); }

/* room table: hide Adults/Children/Total columns + engine note attached below */
.aib-redesign .room-types-table .col-hidden{ display:none !important; }
.aib-redesign .service-component.t-hotel .room-types-table{ border-radius:10px 10px 0 0; border-bottom:0; }
.aib-redesign .rooms-engine-note{
  display:block; font-size:11.5px; color:var(--ink-soft);
  background:var(--hotel-tint); border:1px solid #cfe0fb; border-top:0; border-radius:0 0 10px 10px;
  padding:9px 13px; line-height:1.5;
}
.aib-redesign .rooms-engine-note strong{ font-weight:700; color:var(--ink); white-space:nowrap; }
.aib-redesign .rooms-note-ico{ color:var(--hotel); font-size:13px; margin-right:6px; }

/* image carousel (16:9) */
.aib-redesign .hotel-gallery-section{ display:block !important; margin:0 0 14px !important; padding:0 !important; }
.aib-redesign .hotel-gallery-section > h5{ display:none; }
.aib-redesign .hotel-gallery-carousel{ position:relative; }
.aib-redesign .gallery-container{
  position:relative; aspect-ratio:16/9; border-radius:11px; overflow:hidden;
  background:linear-gradient(135deg,#33506f,#6f8aac); display:flex; align-items:center; justify-content:center;
  border:0 !important; padding:0 !important;
}
.aib-redesign .gallery-slides{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.aib-redesign .gallery-placeholder{ display:flex; flex-direction:column; align-items:center; gap:8px; color:#fff; opacity:.92; font-weight:700; font-size:14px; }
.aib-redesign .gallery-placeholder .svgico{ width:30px; height:30px; }
.aib-redesign .gallery-nav{
  position:absolute !important; top:50% !important; transform:translateY(-50%); z-index:2;
  width:34px !important; height:34px !important; border-radius:50% !important; border:0 !important;
  background:rgba(255,255,255,.92) !important; color:var(--ink) !important; cursor:pointer;
  display:grid !important; place-items:center; padding:0 !important; box-shadow:var(--shadow-sm);
}
.aib-redesign .gallery-nav .svgico{ width:18px; height:18px; }
.aib-redesign .gallery-prev{ left:10px !important; right:auto !important; }
.aib-redesign .gallery-next{ right:10px !important; left:auto !important; }
.aib-redesign .gallery-counter{
  position:absolute !important; bottom:10px; right:12px; z-index:2;
  background:rgba(20,20,30,.55); color:#fff; font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px;
}

/* ---------- icon sizing + chip refinement (pixel parity with mockup) ---------- */
.aib-redesign .svgico{ display:inline-block; vertical-align:middle; flex:none; width:16px; height:16px; }
.aib-redesign .svc-type-label{ display:flex; align-items:center; gap:5px; }
.aib-redesign .svc-type-label .svgico{ width:13px; height:13px; }
.aib-redesign .service-title-location .svc-loc-icon{ width:13px; height:13px; color:var(--faint); }
.aib-redesign .dt-chip .dt-ico{ width:13px; height:13px; color:var(--faint); }

/* date/time chips: beat the old 15px/700 + 2px-border wrapper rules */
.aib-redesign .service-component.t-hotel .dt-chip{
  position:relative; flex:none !important; display:inline-flex !important; align-items:center; gap:6px;
  padding:5px 11px !important; border:1px solid var(--line-2) !important; border-bottom:1px solid var(--line-2) !important;
  border-radius:var(--radius-pill) !important; background:#fff !important; box-shadow:none !important; min-width:0 !important;
}
.aib-redesign .service-component.t-hotel .dt-chip .service-date-display,
.aib-redesign .service-component.t-hotel .dt-chip .service-time-display,
.aib-redesign .service-component.t-hotel .dt-chip .service-date-placeholder,
.aib-redesign .service-component.t-hotel .dt-chip .service-time-placeholder{
  font-size:12.5px !important; font-weight:600 !important; color:var(--ink-soft) !important; padding:0 !important; margin:0 !important;
}
.aib-redesign .service-component.t-hotel .dt-chip .service-date-placeholder,
.aib-redesign .service-component.t-hotel .dt-chip .service-time-placeholder{ color:var(--faint) !important; }
.aib-redesign .service-component.t-hotel .dt-chip:hover{ border-color:var(--hotel) !important; }
.aib-redesign .service-component.t-hotel .dt-chip:hover .dt-ico,
.aib-redesign .service-component.t-hotel .dt-chip:hover .service-date-display,
.aib-redesign .service-component.t-hotel .dt-chip:hover .service-time-display{ color:var(--hotel) !important; }

/* pencil edit-icon → invisible full-chip click overlay (edit still fires; no visible pencil) */
.aib-redesign .dt-chip .service-date-edit-icon,
.aib-redesign .dt-chip .service-time-edit-icon{
  position:absolute !important; inset:0 !important; margin:0 !important; padding:0 !important;
  width:auto !important; height:auto !important; min-width:0 !important; font-size:0 !important;
  color:transparent !important; background:transparent !important; border:0 !important; cursor:pointer; z-index:1;
}
.aib-redesign .service-date-wrapper.editing .service-date-edit-icon,
.aib-redesign .service-time-wrapper.editing .service-time-edit-icon{ display:none !important; }
.aib-redesign .service-date-wrapper.editing .service-date-input,
.aib-redesign .service-time-wrapper.editing .service-time-input{ position:relative; z-index:2; }

/* ---------- room table: frozen vs editable + meals width + capacity caption ---------- */
/* room name + capacity caption — flush left, no checkbox gap */
.aib-redesign .room-types-table th:first-child,
.aib-redesign .room-types-table td:first-child{ text-align:left !important; padding-left:14px !important; }
.aib-redesign .room-checkbox-hidden{ display:none !important; }
/* neutralise the label box so the name sits flush-left, aligned with its caption */
.aib-redesign .room-name-label{ display:contents; }
.aib-redesign .room-name-text{ display:block; font-weight:700; color:var(--ink); font-size:13px; }
.aib-redesign .room-cap{ display:block; color:var(--muted); font-size:11.5px; font-weight:400; margin-top:2px; }
/* the room-info-icon (if any) shouldn't add left indent */
.aib-redesign .room-types-table td:first-child{ padding-left:14px !important; }

/* column widths — MUST use !important to beat the old 9-column widths (which were
   keyed to the old order, so old nth-child(4)=10% was squeezing the new MEALS column). */
.aib-redesign .room-types-table th:nth-child(1),
.aib-redesign .room-types-table td:nth-child(1){ width:25% !important; }
.aib-redesign .room-types-table th:nth-child(2),
.aib-redesign .room-types-table td:nth-child(2){ width:10% !important; }
.aib-redesign .room-types-table th:nth-child(3),
.aib-redesign .room-types-table td:nth-child(3){ width:11% !important; }
.aib-redesign .room-types-table th:nth-child(4),
.aib-redesign .room-types-table td:nth-child(4){ width:20% !important; text-align:left !important; }
.aib-redesign .room-types-table th:nth-child(5),
.aib-redesign .room-types-table td:nth-child(5){ width:10% !important; }
.aib-redesign .room-types-table th:nth-child(6),
.aib-redesign .room-types-table td:nth-child(6){ width:11% !important; }
/* hidden columns take no space */
.aib-redesign .room-types-table th.col-hidden,
.aib-redesign .room-types-table td.col-hidden{ width:0 !important; padding:0 !important; }

/* BUILDER mode: Extra bed is engine/traveler-decided at booking, so it's hidden while
   building a template. It stays visible on the inquiry/preview page (aib-inquiry-mode).
   The freed width goes to ROOM TYPE (long room names need it). */
.aib-redesign.aib-builder-mode .room-types-table th:nth-child(5),
.aib-redesign.aib-builder-mode .room-types-table td:nth-child(5){ display:none !important; }
.aib-redesign.aib-builder-mode .room-types-table th:nth-child(1),
.aib-redesign.aib-builder-mode .room-types-table td:nth-child(1){ width:35% !important; }

/* FROZEN columns — rate/night & rooms (listing/engine) — light gray, not editable */
.aib-redesign .room-types-table .room-price,
.aib-redesign .room-types-table .room-count{
  color:var(--muted) !important; -webkit-text-fill-color:var(--muted);
  background:transparent !important; border:0 !important; box-shadow:none !important;
  cursor:default !important; pointer-events:none; font-weight:600; opacity:1 !important; text-align:center;
}
/* SELECTABLE dropdowns — meals (left, wide) & extra bed — default "—" */
.aib-redesign .room-types-table .room-meal,
.aib-redesign .room-types-table .room-extra-bed{
  color:var(--ink-soft) !important; -webkit-text-fill-color:var(--ink-soft); opacity:1 !important;
  background:#fff !important; border:1px solid var(--line-2) !important; border-radius:8px !important;
  font-weight:600; cursor:pointer !important; pointer-events:auto !important; padding:5px 8px !important;
}
.aib-redesign .room-types-table .room-meal{ width:100% !important; max-width:none !important; min-width:0 !important; text-align:left !important; }
.aib-redesign .room-types-table .room-extra-bed{ width:100% !important; max-width:60px !important; min-width:0 !important; text-align:center; padding:5px 4px !important; }
.aib-redesign .room-types-table .room-meal:focus,
.aib-redesign .room-types-table .room-extra-bed:focus{ border-color:var(--hotel) !important; box-shadow:0 0 0 3px var(--hotel-tint) !important; outline:none; }

/* EDITABLE column — Nights only — jet black, editable look, default 1 */
.aib-redesign .room-types-table .room-days{
  color:var(--ink) !important; -webkit-text-fill-color:var(--ink);
  background:#fff !important; border:1px solid var(--line-2) !important; border-radius:8px !important;
  cursor:text !important; pointer-events:auto !important; font-weight:700; text-align:center; max-width:62px;
}
.aib-redesign .room-types-table .room-days:focus{ border-color:var(--hotel) !important; box-shadow:0 0 0 3px var(--hotel-tint) !important; }

/* ---------- pickers: no pill expansion + custom time popover ---------- */
/* date input present (not display:none) so showPicker() works — kept invisible, anchored to chip */
.aib-redesign .dt-chip-date .service-date-input{
  display:block !important; position:absolute !important; left:11px; bottom:2px;
  width:1px !important; height:1px !important; opacity:0 !important; pointer-events:none; border:0 !important;
}
.aib-redesign .dt-chip-time .service-time-input{ display:none !important; }
/* belt-and-braces: never let the legacy .editing state widen a redesign chip */
.aib-redesign .service-date-wrapper.editing,
.aib-redesign .service-time-wrapper.editing{ padding:5px 11px !important; }
.aib-redesign .service-date-wrapper.editing .service-date-input,
.aib-redesign .service-time-wrapper.editing .service-time-input{
  width:1px !important; min-width:0 !important; opacity:0 !important; position:absolute !important; border:0 !important; box-shadow:none !important;
}
.aib-redesign .service-date-wrapper.editing .service-date-display,
.aib-redesign .service-time-wrapper.editing .service-time-display{ display:inline-block !important; }

/* custom time picker popover (appended to <body>, so not under .aib-redesign) */
.aib-timepop{ position:fixed; z-index:100000; background:#fff; border:1px solid #dcdcd9; border-radius:12px;
  box-shadow:0 14px 38px -16px rgba(20,20,30,.32); width:206px; padding:11px;
  font-family:'Google Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif; animation:aibpop .14s ease; }
@keyframes aibpop{ from{opacity:0;transform:scale(.97)} to{opacity:1;transform:none} }
.aib-timepop .tp-preview{ text-align:center; font-size:16px; font-weight:700; color:#1a1a1d; margin-bottom:9px; letter-spacing:.01em; }
.aib-timepop .tp-ap-lbl{ color:#7700FF; }
.aib-timepop .tp-cols{ display:grid; grid-template-columns:1fr 1fr 46px; gap:6px; }
.aib-timepop .tp-collabel{ font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:#6a6a73; text-align:center; margin-bottom:4px; height:11px; }
.aib-timepop .tp-col{ height:116px; overflow-y:auto; overscroll-behavior:contain; border:1px solid #e8e8e6; border-radius:9px; padding:3px; background:#fafafa; }
.aib-timepop .tp-col::-webkit-scrollbar{ width:4px; }
.aib-timepop .tp-col::-webkit-scrollbar-thumb{ background:#d6d6d2; border-radius:6px; }
.aib-timepop .tp-opt{ text-align:center; padding:5px 0; border-radius:7px; font-size:12.5px; font-weight:600; color:#3a3a40; cursor:pointer; transition:background .12s, color .12s; }
.aib-timepop .tp-opt:hover{ background:#fff; }
.aib-timepop .tp-opt.on{ background:#7700FF; color:#fff; }
.aib-timepop .tp-ap{ display:flex; flex-direction:column; gap:5px; }
.aib-timepop .tp-ap .tp-opt{ padding:8px 0; }
.aib-timepop .tp-actions{ display:flex; justify-content:flex-end; gap:6px; margin-top:10px; }
.aib-timepop .tp-btn{ border:0; border-radius:8px; padding:6px 13px; font-size:12px; font-weight:700; cursor:pointer; font-family:inherit; }
.aib-timepop .tp-cancel{ background:#fff; border:1px solid #dcdcd9; color:#1a1a1d; }
.aib-timepop .tp-done{ background:#090920; color:#fff; }

/* ---------- locked hotel name (Option 1: name bound to the listing) ---------- */
.aib-redesign .service-title-locked{
  background:var(--field-bg) !important; color:var(--ink-soft) !important;
  cursor:default !important; -webkit-text-fill-color:var(--ink-soft);
}
.aib-redesign .service-title-locked:focus{ border-color:var(--line-2) !important; box-shadow:none !important; }
.aib-redesign .aib-lock-hint{
  font-size:10px; font-weight:600; color:var(--faint); text-transform:none; letter-spacing:0; margin-left:6px;
}

/* date chip is read-only (auto from Nights) — no clickable affordance; time chip stays interactive */
.aib-redesign .dt-chip-date{ cursor:default !important; }
.aib-redesign .dt-chip-date:hover{ border-color:var(--line-2) !important; color:var(--ink-soft) !important; }
.aib-redesign .dt-chip-date:hover .dt-ico{ color:var(--faint) !important; }

/* date chip = fully read-only / disabled feel (no click, no blue focus outline) */
.aib-redesign .dt-chip-date{ pointer-events:none !important; cursor:default !important; outline:none !important; box-shadow:none !important; }
.aib-redesign .dt-chip-date *{ pointer-events:none !important; outline:none !important; box-shadow:none !important; }

/* hotel name: more breathing room below the carousel, tighter label↔field */
.aib-redesign .service-field-hotelname{ margin-top:20px !important; gap:3px !important; margin-bottom:13px !important; }
.aib-redesign .service-field-hotelname > label{ margin-bottom:0 !important; }

/* ============================================================
   ACTIVITY / CURATOR service component (t-activity = green, t-curated = bronze)
   ============================================================ */
.aib-redesign .service-component.service-activity{ position:relative; background:var(--card); border:1px solid var(--line) !important; border-radius:var(--radius-sm) !important; margin-bottom:11px; overflow:hidden; box-shadow:var(--shadow-sm); transition:box-shadow var(--t),border-color var(--t); }
.aib-redesign .service-activity::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; z-index:1; }
.aib-redesign .service-activity.t-activity::before{ background:var(--act); }
.aib-redesign .service-activity.t-curated::before{ background:var(--cur); }
.aib-redesign .service-activity:hover{ box-shadow:var(--shadow); }
.aib-redesign .service-activity.t-activity:not(.collapsed){ border:1.5px solid var(--act) !important; box-shadow:var(--shadow); }
.aib-redesign .service-activity.t-curated:not(.collapsed){ border:1.5px solid var(--cur) !important; box-shadow:var(--shadow); }

/* header layout */
.aib-redesign .service-activity .service-header{ display:flex !important; align-items:center !important; gap:13px; grid-template-columns:none !important; grid-template-rows:none !important; height:auto !important; min-height:0 !important; width:auto !important; margin:0 !important; border:0 !important; box-shadow:none !important; background:#fff; padding:13px 14px 13px 16px; cursor:pointer; transition:var(--t); box-sizing:border-box; }
.aib-redesign .service-activity .service-header:hover{ background:var(--field-bg); }
.aib-redesign .service-activity.t-activity:not(.collapsed) .service-header{ background:linear-gradient(180deg,#dcefe2 0%,var(--act-tint) 45%,#fff 100%) !important; }
.aib-redesign .service-activity.t-curated:not(.collapsed) .service-header{ background:linear-gradient(180deg,#efe6cf 0%,var(--cur-tint) 45%,#fff 100%) !important; }

/* collapse chevron */
.aib-redesign .service-activity .activity-collapse-btn{ order:0 !important; grid-column:auto !important; grid-row:auto !important; position:static !important; width:28px !important; height:28px !important; flex:none; padding:0 !important; margin:0 !important; border:1px solid var(--line-2) !important; background:#fff !important; border-radius:8px !important; display:grid !important; place-items:center; color:var(--faint); cursor:pointer; transition:var(--t); box-shadow:none; }
.aib-redesign .service-activity .service-header:hover .activity-collapse-btn{ border-color:var(--ink); color:var(--ink); }
.aib-redesign .service-activity.t-activity:not(.collapsed) .activity-collapse-btn{ color:var(--act) !important; border-color:var(--act) !important; }
.aib-redesign .service-activity.t-curated:not(.collapsed) .activity-collapse-btn{ color:var(--cur) !important; border-color:var(--cur) !important; }
.aib-redesign .service-activity .activity-collapse-btn .svgico{ width:16px; height:16px; transition:transform .16s ease; }
.aib-redesign .service-activity.collapsed .activity-collapse-btn .svgico{ transform:rotate(0deg) !important; }
.aib-redesign .service-activity:not(.collapsed) .activity-collapse-btn .svgico{ transform:rotate(180deg) !important; }

/* tile + title */
.aib-redesign .service-activity.t-activity .svc-tile{ background:var(--act-tint); color:var(--act); }
.aib-redesign .service-activity.t-curated .svc-tile{ background:var(--cur-tint); color:var(--cur); }
.aib-redesign .service-activity .activity-title-column{ flex:1; min-width:0; display:block; grid-column:auto !important; grid-row:auto !important; border:0 !important; }
.aib-redesign .service-activity.t-activity .svc-type-label{ color:var(--act); }
.aib-redesign .service-activity.t-curated .svc-type-label{ color:var(--cur); }
.aib-redesign .service-activity .service-title-name{ font-weight:700; font-size:15px; letter-spacing:-.01em; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.3; }
.aib-redesign .service-activity .service-title-location{ color:var(--muted); font-size:12.5px; margin-top:2px; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.aib-redesign .service-activity .rscore{ display:inline-flex; align-items:center; gap:3px; font-weight:600; }
.aib-redesign .service-activity .rscore .star{ color:#caa53e; width:13px; height:13px; }

/* right cluster + price */
.aib-redesign .service-activity .activity-datetime-col{ display:flex !important; align-items:center; gap:8px; flex:none; flex-direction:row !important; grid-column:auto !important; grid-row:auto !important; border:0 !important; padding:0 !important; margin:0 !important; }
.aib-redesign .service-activity .activity-price-display{ grid-column:auto !important; grid-row:auto !important; border:0 !important; display:flex !important; flex-direction:column; align-items:flex-end; gap:2px; flex:none; padding:0 !important; }
.aib-redesign .service-activity .price-row{ display:flex; align-items:baseline; gap:8px; justify-content:flex-end; }
.aib-redesign .service-activity .price-label{ font-size:11px; color:var(--muted); font-weight:600; }
.aib-redesign .service-activity .price-row b{ font-size:15px; font-weight:700; color:var(--ink); min-width:40px; text-align:right; }

/* delete */
.aib-redesign .service-activity .activity-delete-btn{ grid-column:auto !important; grid-row:auto !important; position:static !important; width:32px !important; height:32px !important; flex:none; padding:0 !important; margin:0 !important; border:1px solid var(--line) !important; background:#fff !important; border-radius:9px !important; display:grid !important; place-items:center; color:var(--muted); cursor:pointer; transition:var(--t); box-shadow:none; }
.aib-redesign .service-activity .activity-delete-btn:hover{ color:var(--danger); border-color:#e7c4c0; background:var(--danger-tint); }
.aib-redesign .service-activity .activity-delete-btn .svgico{ width:17px; height:17px; }

/* body */
.aib-redesign .service-activity.collapsed .service-body{ display:none; }
.aib-redesign .service-activity .service-body{ padding:14px 16px 16px; }
.aib-redesign .service-activity .activity-display-row{ display:none; }
.aib-redesign .service-activity .activity-title-only-row label{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.aib-redesign .service-activity .activity-title-input{ border:1px solid var(--line-2); border-radius:10px; padding:10px 12px; font-size:14px; font-family:inherit; outline:none; width:100%; }

/* hide activity date/time native inputs + edit-icon overlay */
.aib-redesign .dt-chip .activity-date-input, .aib-redesign .dt-chip .activity-time-input{ display:none !important; }
.aib-redesign .dt-chip .activity-date-edit-icon, .aib-redesign .dt-chip .activity-time-edit-icon{ position:absolute !important; inset:0 !important; margin:0 !important; padding:0 !important; width:auto !important; height:auto !important; font-size:0 !important; color:transparent !important; background:transparent !important; cursor:pointer; z-index:1; }
.aib-redesign .activity-time-wrapper.editing .activity-time-input{ display:none !important; }
.aib-redesign .activity-date-wrapper.editing .activity-date-display, .aib-redesign .activity-time-wrapper.editing .activity-time-display{ display:inline-block !important; }

/* carousel */
.aib-redesign .activity-gallery-section{ display:block !important; margin:0 0 16px !important; padding:0 !important; }
.aib-redesign .activity-gallery-section > label{ display:none; }
.aib-redesign .activity-gallery-carousel{ position:relative; }

/* day buttons + items */
.aib-redesign .activity-two-column-grid{ display:grid; grid-template-columns:180px 1fr; gap:14px; margin-top:4px; }
.aib-redesign .activity-days-column{ display:flex; flex-direction:column; gap:7px; }
.aib-redesign .activity-day-btn{ display:block; width:100%; text-align:left; border:1px solid var(--line-2); background:#fff; border-radius:10px; padding:9px 12px; cursor:pointer; font-family:inherit; transition:var(--t); overflow:hidden; }
.aib-redesign .activity-day-btn:hover{ background:var(--field-bg); }
.aib-redesign .service-activity.t-activity .activity-day-btn.active{ border-color:var(--act); background:var(--act-tint); }
.aib-redesign .service-activity.t-curated .activity-day-btn.active{ border-color:var(--cur); background:var(--cur-tint); }
.aib-redesign .day-btn-label{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.aib-redesign .service-activity.t-activity .activity-day-btn.active .day-btn-label{ color:var(--act); }
.aib-redesign .service-activity.t-curated .activity-day-btn.active .day-btn-label{ color:var(--cur); }
.aib-redesign .day-btn-activity{ font-size:13px; font-weight:600; color:var(--ink); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aib-redesign .activity-items-column{ border:1px solid var(--line); border-radius:10px; padding:12px 14px; }
.aib-redesign .activity-items-header{ margin-bottom:8px; }
.aib-redesign .activity-items-title{ font-size:13px; font-weight:700; margin:0; }
.aib-redesign .activity-items-subtitle{ font-size:11px; color:var(--muted); margin-top:1px; }
.aib-redesign .activity-items-list{ list-style:none; margin:0; padding:0; }
.aib-redesign .activity-item{ display:flex; gap:9px; padding:7px 0; border-top:1px solid var(--line); }
.aib-redesign .activity-item:first-child{ border-top:0; }
.aib-redesign .item-bullet{ font-weight:700; }
.aib-redesign .service-activity.t-activity .item-bullet{ color:var(--act); }
.aib-redesign .service-activity.t-curated .item-bullet{ color:var(--cur); }
.aib-redesign .item-time{ font-size:11.5px; color:var(--muted); font-weight:600; display:block; }
.aib-redesign .item-title{ font-size:13.5px; font-weight:600; }
.aib-redesign .no-items-message{ color:var(--muted); font-size:13px; padding:8px 0; margin:0; }

/* per-person pills */
.aib-redesign .service-activity .unit-prices{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; justify-content:flex-end; }
.aib-redesign .service-activity .unit-pill{ border:1px solid var(--line-2); border-radius:10px; padding:8px 13px; font-size:13px; background:var(--field-bg); text-align:right; }
.aib-redesign .service-activity .unit-pill .lbl{ display:block; color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.aib-redesign .service-activity .unit-pill b{ font-size:15px; }

/* ============================================================
   ACTIVITY header parity — beat the old 2px borders / 15px fonts / divider line
   ============================================================ */
/* chips: subtle pill (generic so activity gets it too) */
.aib-redesign .service-component .dt-chip{
  border:1px solid var(--line-2) !important; border-bottom:1px solid var(--line-2) !important;
  border-radius:var(--radius-pill) !important; padding:5px 11px !important; background:#fff !important;
  flex:none !important; box-shadow:none !important; min-width:0 !important; gap:6px;
}
.aib-redesign .service-activity .dt-chip .activity-date-display,
.aib-redesign .service-activity .dt-chip .activity-time-display,
.aib-redesign .service-activity .dt-chip .activity-date-placeholder,
.aib-redesign .service-activity .dt-chip .activity-time-placeholder{
  font-size:12.5px !important; font-weight:600 !important; color:var(--ink-soft) !important; padding:0 !important; text-align:center !important;
}
.aib-redesign .service-activity .dt-chip .activity-date-placeholder,
.aib-redesign .service-activity .dt-chip .activity-time-placeholder{ color:var(--faint) !important; }
.aib-redesign .service-activity .dt-chip .dt-ico{ color:var(--faint) !important; }

/* price: small, right-aligned, NO divider line, NO right border */
.aib-redesign .service-activity .activity-price-display{
  border:0 !important; padding:0 !important; gap:2px !important; background:transparent !important;
  display:flex !important; flex-direction:column !important; align-items:flex-end !important;
}
.aib-redesign .service-activity .price-row{ padding:0 !important; justify-content:flex-end !important; text-align:right !important; gap:8px !important; }
.aib-redesign .service-activity .price-adult{ border-bottom:0 !important; }
.aib-redesign .service-activity .price-label{ font-size:11px !important; font-weight:600 !important; color:var(--muted) !important; text-align:right !important; }
.aib-redesign .service-activity .price-row b,
.aib-redesign .service-activity .activity-price-value-adult,
.aib-redesign .service-activity .activity-price-value-child{ font-size:15px !important; font-weight:700 !important; color:var(--ink) !important; }

/* ============================================================
   CUSTOM service component (t-custom = terracotta)
   ============================================================ */
.aib-redesign .service-component.service-custom{ position:relative; background:var(--card); border:1px solid var(--line) !important; border-radius:var(--radius-sm) !important; margin-bottom:11px; overflow:hidden; box-shadow:var(--shadow-sm); transition:box-shadow var(--t),border-color var(--t); }
.aib-redesign .service-custom::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--custom); z-index:1; }
.aib-redesign .service-custom:hover{ box-shadow:var(--shadow); }
.aib-redesign .service-custom:not(.collapsed){ border:1.5px solid var(--custom) !important; box-shadow:var(--shadow); }

/* header */
.aib-redesign .service-custom .service-header{ display:flex !important; align-items:center !important; gap:13px; grid-template-columns:none !important; grid-template-rows:none !important; height:auto !important; min-height:0 !important; width:auto !important; margin:0 !important; border:0 !important; box-shadow:none !important; background:#fff; padding:13px 14px 13px 16px; cursor:pointer; transition:var(--t); box-sizing:border-box; }
.aib-redesign .service-custom .service-header:hover{ background:var(--field-bg); }
.aib-redesign .service-custom:not(.collapsed) .service-header{ background:linear-gradient(180deg,#f3e2de 0%,var(--custom-tint) 45%,#fff 100%) !important; }

/* chevron */
.aib-redesign .service-custom .collapse-service-btn{ order:0 !important; grid-column:auto !important; grid-row:auto !important; position:static !important; width:28px !important; height:28px !important; flex:none; padding:0 !important; margin:0 !important; border:1px solid var(--line-2) !important; background:#fff !important; border-radius:8px !important; border-bottom:1px solid var(--line-2) !important; display:grid !important; place-items:center; color:var(--faint); cursor:pointer; transition:var(--t); box-shadow:none; }
.aib-redesign .service-custom .service-header:hover .collapse-service-btn{ border-color:var(--ink); color:var(--ink); }
.aib-redesign .service-custom:not(.collapsed) .collapse-service-btn{ color:var(--custom) !important; border-color:var(--custom) !important; }
.aib-redesign .service-custom .collapse-service-btn .svgico{ width:16px; height:16px; transition:transform .16s ease; }
.aib-redesign .service-custom.collapsed .collapse-service-btn .svgico{ transform:rotate(0deg) !important; }
.aib-redesign .service-custom:not(.collapsed) .collapse-service-btn .svgico{ transform:rotate(180deg) !important; }

/* tile + title */
.aib-redesign .service-custom .svc-tile{ background:var(--custom-tint); color:var(--custom); }
.aib-redesign .service-custom .service-title-column{ flex:1; min-width:0; display:block; grid-column:auto !important; grid-row:auto !important; border:0 !important; }
.aib-redesign .service-custom .svc-type-label{ color:var(--custom); }
.aib-redesign .service-custom .service-title-display{ font-weight:700; font-size:15px; letter-spacing:-.01em; color:var(--ink); margin:0; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border:0 !important; padding:0 !important; }
.aib-redesign .service-custom .service-title-location{ color:var(--muted); font-size:12.5px; margin-top:2px; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.aib-redesign .service-custom .service-title-location .svgico{ width:13px; height:13px; color:var(--faint); }

/* right + price (flat) + delete */
.aib-redesign .service-custom .service-datetime-col{ display:flex !important; align-items:center; gap:8px; flex:none; flex-direction:row !important; grid-column:auto !important; grid-row:auto !important; border:0 !important; padding:0 !important; margin:0 !important; }
.aib-redesign .service-custom .service-price-display{ grid-column:auto !important; grid-row:auto !important; border:0 !important; display:block !important; text-align:right !important; flex:none; padding:0 !important; min-width:64px; }
.aib-redesign .service-custom .svc-flat-price{ font-size:15px; font-weight:700; color:var(--ink); }
.aib-redesign .service-custom .service-price-display small{ display:block; font-size:11px; color:var(--muted); font-weight:500; }
.aib-redesign .service-custom .delete-service-btn{ grid-column:auto !important; grid-row:auto !important; position:static !important; width:32px !important; height:32px !important; flex:none; padding:0 !important; margin:0 !important; border:1px solid var(--line) !important; background:#fff !important; border-radius:9px !important; display:grid !important; place-items:center; color:var(--muted); cursor:pointer; transition:var(--t); box-shadow:none; }
.aib-redesign .service-custom .delete-service-btn:hover{ color:var(--danger); border-color:#e7c4c0; background:var(--danger-tint); }
.aib-redesign .service-custom .delete-service-btn .svgico{ width:17px; height:17px; }

/* body fields */
.aib-redesign .service-custom.collapsed .service-body{ display:none; }
.aib-redesign .service-custom .service-body{ padding:14px 16px 16px; }
.aib-redesign .service-custom .service-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:13px; }
.aib-redesign .service-custom .service-field > label{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.aib-redesign .service-custom .service-field input,
.aib-redesign .service-custom .service-field select,
.aib-redesign .service-custom .service-field textarea,
.aib-redesign .service-custom .custom-fields-grid input,
.aib-redesign .service-custom .custom-fields-grid select{ border:1px solid var(--line-2) !important; border-radius:10px !important; padding:10px 12px !important; font-size:14px !important; font-family:inherit; outline:none; background:#fff !important; color:var(--ink) !important; width:100%; box-sizing:border-box; }
.aib-redesign .service-custom .service-field input:focus,
.aib-redesign .service-custom .service-field select:focus,
.aib-redesign .service-custom .service-field textarea:focus,
.aib-redesign .service-custom .custom-fields-grid input:focus,
.aib-redesign .service-custom .custom-fields-grid select:focus{ border-color:var(--custom) !important; box-shadow:0 0 0 3px var(--custom-tint) !important; }
.aib-redesign .service-custom .custom-fields-grid{ display:grid !important; grid-template-columns:1fr 1fr; gap:13px; margin-bottom:13px; }
.aib-redesign .service-custom .custom-fields-grid .service-field{ margin-bottom:0; }
.aib-redesign .service-custom .custom-req{ color:var(--custom); }
.aib-redesign .service-custom .custom-provider-fields{ margin-bottom:13px; }

/* image upload */
.aib-redesign .service-custom .service-image-upload{ margin-bottom:13px; }
.aib-redesign .service-custom .upload-image-btn{ border:1px solid var(--line-2) !important; background:#fff !important; color:var(--ink) !important; border-radius:9px !important; padding:9px 14px !important; font-weight:600; font-size:13px; cursor:pointer; box-shadow:none !important; height:auto !important; }
.aib-redesign .service-custom .upload-image-btn:hover{ background:var(--field-bg) !important; }

/* type notice (injected by JS) */
.aib-redesign .service-custom .custom-type-notice{ display:flex; gap:9px; align-items:flex-start; font-size:12.5px; border-radius:10px; padding:11px 13px; line-height:1.5; margin-bottom:13px; }
.aib-redesign .service-custom .custom-type-notice--warning{ background:var(--custom-tint); color:#7a3d33; border:1px solid #e7c4bc; }
.aib-redesign .service-custom .custom-type-notice--info{ background:var(--field-bg); color:var(--ink-soft); border:1px solid var(--line-2); }
.aib-redesign .service-custom .custom-type-notice .svgico{ flex:none; width:15px; height:15px; margin-top:1px; }
.aib-redesign .service-custom .custom-type-notice--warning .svgico{ color:var(--custom); }
.aib-redesign .service-custom .custom-type-notice--info .svgico{ color:var(--faint); }
.aib-redesign .service-custom .custom-type-notice > span{ flex:1; }

/* custom: drop the old pink flag tint → white card; hide the inline "pending
   registration" badge for now (it'll be placed elsewhere on the card later) */
.aib-redesign .service-custom.sarisara-custom-flag .service-header{ background:#fff !important; border-left:0 !important; }
.aib-redesign .service-custom.sarisara-custom-flag:not(.collapsed) .service-header{ background:linear-gradient(180deg,#f3e2de 0%,var(--custom-tint) 45%,#fff 100%) !important; }
.aib-redesign .service-custom .service-title-display::after{ content:none !important; display:none !important; }
.aib-redesign .service-custom .custom-flag-tag{ display:none !important; }

/* "Pending Publishing" ribbon — shown ONLY for custom hotel/activity (the gate
   adds .sarisara-custom-flag to those, since admin must create a real SLTDA
   listing before they can go live). Hidden for transport/meal/guide/other. */
/* Ribbon sits INSIDE the header, hanging down from the top edge (its top is
   tucked/clipped flush by the card's own overflow:hidden — which we KEEP so the
   rounded card corners stay intact). Rounded bottom corners give the banner look.
   Shown only on flagged hotel/activity cards. */
.aib-redesign .service-custom .service-header{ position:relative; }
.aib-redesign .service-custom .custom-pending-ribbon{ display:none; }
.aib-redesign .service-custom.sarisara-custom-flag .custom-pending-ribbon{
  display:inline-flex; align-items:center; justify-content:center;
  position:absolute; top:-11px; left:50%; transform:translateX(-50%); z-index:8;
  background:#FF0A1F !important; color:#fff !important;
  font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  padding:15px 20px 5px; border-radius:0 0 12px 12px; white-space:nowrap;
  box-shadow:0 5px 9px -3px rgba(255,10,31,.35);
}
/* type-label puzzle icon + sub-line spark/pin icons */
.aib-redesign .service-custom .svc-type-label{ display:flex; align-items:center; gap:5px; }
.aib-redesign .service-custom .svc-type-label .svgico{ width:13px; height:13px; }
.aib-redesign .service-custom .service-title-location .svgico{ width:13px; height:13px; color:var(--faint); }

/* date/time chip text → 12.5px for ALL service types (custom used service-* classes
   that the t-hotel-scoped rule missed, so they showed the old 15px) */
.aib-redesign .service-component .dt-chip .service-date-display,
.aib-redesign .service-component .dt-chip .service-time-display,
.aib-redesign .service-component .dt-chip .service-date-placeholder,
.aib-redesign .service-component .dt-chip .service-time-placeholder{
  font-size:12.5px !important; font-weight:600 !important; color:var(--ink-soft) !important; padding:0 !important; line-height:1.2 !important;
}
.aib-redesign .service-component .dt-chip .service-date-placeholder,
.aib-redesign .service-component .dt-chip .service-time-placeholder{ color:var(--faint) !important; }

/* custom flat price: tight "$45" (no gap, $ same size as amount) */
.aib-redesign .service-custom .svc-flat-price{ font-size:15px; font-weight:700; color:var(--ink); white-space:nowrap; }
.aib-redesign .service-custom .svc-flat-price .service-price-value{
  font-size:inherit !important; font-weight:inherit !important; color:inherit !important; margin:0 !important; padding:0 !important;
}

/* ============================================================
   DAY CARD HEADER — ports the mockup .day-head one-to-one.
   Overrides the injected grid layout (black 2px borders) at JS ~line 6040.
   Preserves all hooks: .aib-collapse-day, .day-label/.day-number,
   .day-title-display, .day-date-input (hidden)/.day-date-display,
   .day-price-value, .aib-delete-day.
   ============================================================ */
/* Builder tab background: light-gray container, white day cards. Scoped to the
   builder (.aib-redesign) only — never bleeds to other dashboard/admin tabs. */
.aib-redesign{ background:#F8F8F8 !important; padding:20px !important; border-radius:14px; box-sizing:border-box; }
.aib-redesign .aib-day{
  position:relative;
  background:var(--card); border:1px solid var(--line) !important; border-radius:var(--radius) !important;
  box-shadow:var(--shadow-sm); margin-bottom:16px; overflow:hidden;
}
.aib-redesign .aib-day-header{
  display:flex !important; align-items:center; gap:16px; padding:12px 15px !important;   /* Chiran, 25 Oct 2026 (was 18px) */
  grid-template-columns:none !important; grid-template-rows:none !important;
  background:#fff !important; border:0 !important; margin:0 !important; cursor:pointer;
}
.aib-redesign .aib-day:not(.day-collapsed) .aib-day-header{ border-bottom:1px solid var(--line) !important; }

/* chevron / collapse — bordered box (matches the delete button / image #101) */
.aib-redesign .aib-day-header .aib-collapse-day{
  grid-column:auto !important; grid-row:auto !important;
  width:36px; height:36px; border-radius:9px; border:1px solid var(--line) !important; border-bottom:1px solid var(--line) !important;
  background:#fff !important; display:grid !important; place-items:center; color:var(--muted);
  flex:none; padding:0 !important; cursor:pointer; transition:var(--t); box-shadow:none;
}
.aib-redesign .aib-day-header .aib-collapse-day .svgico{ width:18px; height:18px; transition:transform var(--t); }
.aib-redesign .aib-day:not(.day-collapsed) .aib-day-header .aib-collapse-day .svgico{ transform:rotate(180deg); }
.aib-redesign .aib-day-header .aib-collapse-day:hover{ color:var(--ink); background:var(--field-bg) !important; border-color:var(--line-2) !important; }

/* DAY n label + vertical rule
   (font/color/text-align use !important to beat overrides.css:170-181) */
.aib-redesign .aib-day-header .day-label{
  grid-column:auto !important; grid-row:auto !important;
  font-size:14px !important; font-weight:800 !important; letter-spacing:.12em; text-transform:uppercase;
  color:var(--violet) !important; text-align:center !important;
  /* fixed width so the separator + titles line up regardless of "DAY 1" vs "DAY 2-3" */
  flex:none; width:104px; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  padding:0 4px !important; border:0 !important; background:none !important;
}
.aib-redesign .aib-day-header .day-label .day-number{ color:var(--violet) !important; font-weight:800 !important; }
.aib-redesign .aib-day-header .day-rule{ width:1px; align-self:stretch; min-height:34px; background:var(--line-2); border-radius:1px; flex:none; }

/* main: title + meta */
.aib-redesign .aib-day-header .day-head-main{ flex:1; min-width:0; }
.aib-redesign .aib-day-header .day-title-display{
  grid-column:auto !important; grid-row:auto !important;
  font-size:16px !important; font-weight:700 !important; letter-spacing:-.01em; color:var(--ink) !important; text-align:left !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  border:0 !important; padding:0 !important; display:block !important;
}
.aib-redesign .aib-day-header .day-head-meta{
  display:flex; align-items:center; gap:9px; color:var(--muted); font-size:12.5px; font-weight:500; margin-top:3px; flex-wrap:wrap;
}
.aib-redesign .aib-day-header .day-meta-date{ display:inline-flex; align-items:center; gap:5px; }
.aib-redesign .aib-day-header .day-head-meta .svgico{ width:13px; height:13px; color:var(--faint); }
/* date display: muted, normal weight, 12.5px — beats overrides.css:721 (700/16px/#000 !important) */
.aib-redesign .aib-day-header .day-date-display{ display:inline !important; color:var(--muted) !important; font-weight:500 !important; font-size:12.5px !important; padding:0 !important; cursor:default; }
.aib-redesign .aib-day-header .day-svc-count{ color:var(--muted); font-weight:500; }
.aib-redesign .aib-day-header .day-head-meta .dot{ width:3px; height:3px; border-radius:50%; background:#cdcdce; display:inline-block; }
.aib-redesign .aib-day-header .day-date-input{ display:none !important; }

/* day total price */
.aib-redesign .aib-day-header .day-head-price{
  grid-column:auto !important; grid-row:auto !important;
  /* fixed width so the price separator lines up regardless of $0 vs $570 vs $1,570 */
  text-align:right !important; flex:none; width:84px; box-sizing:border-box; font-size:12px !important; color:var(--muted) !important;
  border:0 !important; padding:0 !important; white-space:nowrap;
}
.aib-redesign .aib-day-header .day-head-price b{ display:block; font-size:16px !important; color:var(--ink) !important; font-weight:700 !important; }
.aib-redesign .aib-day-header .day-price-value{ font-size:inherit !important; font-weight:inherit !important; color:inherit !important; padding:0 !important; margin:0 !important; }
.aib-redesign .aib-day-header .day-price-value::before{ content:none !important; }

/* delete day */
.aib-redesign .aib-day-header .aib-delete-day{
  grid-column:auto !important; grid-row:auto !important;
  width:34px; height:34px; border-radius:9px; border:1px solid var(--line) !important; border-bottom:1px solid var(--line) !important;
  background:#fff !important; display:grid !important; place-items:center; color:var(--muted);
  flex:none; padding:0 !important; cursor:pointer; transition:var(--t);
}
.aib-redesign .aib-day-header .aib-delete-day:hover{ color:var(--danger); border-color:#e7c4c0 !important; background:var(--danger-tint) !important; }
.aib-redesign .aib-day-header .aib-delete-day .svgico{ width:17px; height:17px; }

/* ============================================================
   EXPANDED DAY BODY — mockup styles, same field positions (image #104).
   Keeps Sarisara layout (Day Count|Title row, Direction, Transfer) and only
   restyles. The Hotels/Activity/Custom tabs are hidden (replaced by the new
   add-service system). Beats overrides.css day-body rules with !important.
   ============================================================ */
.aib-redesign .aib-day-body{ padding:16px 18px 18px !important; background:#fff; }

/* labels: 11px 700 muted uppercase */
.aib-redesign .aib-day-body label{
  font-size:11px !important; font-weight:700 !important; color:var(--muted) !important;
  text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px; display:block;
}

/* Row 1: Day Count (narrow) + Title (wide) */
.aib-redesign .aib-day-body .day-fields-row{ display:flex !important; gap:13px; margin-bottom:16px; align-items:flex-start; }
.aib-redesign .aib-day-body .field-group{ display:flex; flex-direction:column; gap:0; }
.aib-redesign .aib-day-body .field-group:not(.field-full){ width:170px; flex:none; }
.aib-redesign .aib-day-body .field-group.field-full{ flex:1; min-width:0; }

/* inputs (mockup .field input) */
.aib-redesign .aib-day-body .field-group input{
  border:1px solid var(--line-2) !important; border-radius:10px !important; padding:10px 12px !important;
  font-size:14px !important; font-weight:500 !important; font-family:inherit; background:#fff !important;
  color:var(--ink) !important; width:100%; box-sizing:border-box; height:auto !important; outline:none;
  text-align:left !important; transition:var(--t);
}
.aib-redesign .aib-day-body .field-group input:focus{ border-color:var(--violet) !important; box-shadow:0 0 0 3px var(--violet-tint) !important; }
/* read-only Day Count (override overrides.css 52px/center/grey 2px border) */
.aib-redesign .aib-day-body .day-count-input[readonly]{
  background:var(--field-bg) !important; color:var(--ink-soft) !important; border:1px solid var(--line-2) !important;
  font-weight:500 !important; font-size:14px !important; text-align:left !important; height:auto !important;
  width:100% !important; cursor:default !important; opacity:1 !important;
}
.aib-redesign .aib-day-body .day-count-input[readonly]:hover{ background:var(--field-bg) !important; cursor:default !important; }

/* Direction (mockup .direction-box) */
.aib-redesign .aib-day-body .direction-field{ margin-bottom:16px; }
.aib-redesign .aib-day-body .direction-display{
  display:flex !important; align-items:center; gap:8px;
  border:1px solid var(--line) !important; background:var(--field-bg) !important; border-radius:10px;
  padding:10px 12px; font-size:13.5px; color:var(--ink-soft);
}
.aib-redesign .aib-day-body .direction-display .svgico{ width:16px; height:16px; color:var(--violet); flex:none; }
.aib-redesign .aib-day-body .direction-text{ font-size:13.5px !important; color:var(--ink-soft) !important; font-weight:500; }

/* Pickup / Dropoff transfer (mockup .transfer + pill radios) */
.aib-redesign .aib-day-body .airport-transfer-section{
  border:1px solid var(--line) !important; border-radius:12px; padding:13px 14px; margin-bottom:0; background:#fff;
}
.aib-redesign .aib-day-body .airport-transfer-section > label{ margin-bottom:9px; }
.aib-redesign .aib-day-body .transfer-options{ display:flex !important; gap:9px; flex-wrap:wrap; }
.aib-redesign .aib-day-body .transfer-options .radio-option{
  display:inline-flex !important; align-items:stretch !important; gap:8px; margin:0 !important;
  border:1px solid var(--line-2) !important; border-radius:var(--radius-pill) !important; padding:8px 15px !important;
  font-size:13.5px !important; font-weight:600 !important; color:var(--ink-soft) !important; cursor:pointer; transition:var(--t); background:#fff !important;
  text-transform:none !important; letter-spacing:0 !important;
}
/* checked airport-transfer radio dot -> violet */
input[type=radio].airport-transfer-radio:checked::before{ background-color:#7700ff !important; }
.aib-redesign .aib-day-body .transfer-options .radio-option span{ font-size:13.5px !important; font-weight:600 !important; color:inherit !important; text-transform:none !important; letter-spacing:0 !important; margin:0 !important; }
.aib-redesign .aib-day-body .transfer-options .radio-option:hover{ background:var(--field-bg) !important; }
.aib-redesign .aib-day-body .transfer-options .radio-option:has(input:checked){ border-color:var(--violet) !important; color:var(--violet) !important; background:var(--violet-tint) !important; }
.aib-redesign .aib-day-body .transfer-options .radio-option input[type="radio"]{ -webkit-appearance:radio; appearance:auto; width:15px !important; height:15px !important; accent-color:var(--violet); margin:0 !important; flex:none; }

/* transfer detail (pickup/drop location + price) */
.aib-redesign .aib-day-body .transfer-row{ display:grid !important; grid-template-columns:2fr 1fr; gap:12px; margin-top:12px; }
.aib-redesign .aib-day-body .airport-transfer-pickup-price-field,
.aib-redesign .aib-day-body .airport-transfer-drop-price-field{ margin-top:0; }
.aib-redesign .aib-day-body .transfer-location input,
.aib-redesign .aib-day-body .transfer-price input{
  border:1px solid var(--line-2) !important; border-radius:10px !important; padding:10px 12px !important;
  font-size:14px !important; background:#fff !important; color:var(--ink) !important; width:100%; box-sizing:border-box; height:auto !important;
}

/* ============================================================
   ADD-SERVICE BUTTONS + INLINE PICKER (mockup add-row + picker).
   Three buttons under each day open the matching (reused) search/add
   panel. The old tab bar is hidden; the picker container shows only
   when a button marks it .is-open.
   ============================================================ */
.aib-redesign .aib-add-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.aib-redesign .aib-add-btn{
  flex:1; min-width:150px; display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:12px 16px; border-radius:var(--radius-sm); border:1px solid var(--line-2) !important; background:#fff !important;
  color:var(--ink-soft) !important; font-weight:600; font-size:13.5px; cursor:pointer; transition:var(--t); font-family:inherit; box-shadow:none;
}
.aib-redesign .aib-add-btn .svgico{ width:17px; height:17px; color:var(--faint); }
.aib-redesign .aib-add-btn:hover{ border-color:#c9c9c5 !important; background:var(--field-bg) !important; }
.aib-redesign .aib-add-btn[data-type=hotel]:hover .svgico,
.aib-redesign .aib-add-btn[data-type=hotel].active .svgico{ color:var(--hotel); }
.aib-redesign .aib-add-btn[data-type=activity]:hover .svgico,
.aib-redesign .aib-add-btn[data-type=activity].active .svgico{ color:var(--act); }
.aib-redesign .aib-add-btn[data-type=custom]:hover .svgico,
.aib-redesign .aib-add-btn[data-type=custom].active .svgico{ color:var(--custom); }
.aib-redesign .aib-add-btn.active{ background:var(--field-bg) !important; border-color:#c9c9c5 !important; color:var(--ink) !important; }

/* picker container: hidden until a button opens it; tab bar hidden */
.aib-redesign .service-tabs-container{ display:none !important; margin-top:13px; border:1px solid var(--line-2) !important; border-radius:var(--radius-sm) !important; background:#fff !important; box-shadow:var(--shadow) !important; overflow:hidden; }
.aib-redesign .service-tabs-container.is-open{ display:block !important; }
.aib-redesign .service-tabs-container .service-tabs{ display:none !important; }
.aib-redesign .service-tabs-container .service-tab-panel{ padding:14px 16px !important; border:0 !important; background:transparent !important; }
.aib-redesign .service-tabs-container .service-search{ position:relative; }
.aib-redesign .service-tabs-container .service-search-input{
  width:100% !important; box-sizing:border-box; border:1px solid var(--line-2) !important; border-radius:10px !important;
  padding:11px 14px !important; font-size:14.5px !important; font-family:inherit; background:var(--field-bg) !important; color:var(--ink) !important; outline:none; height:auto !important;
}
.aib-redesign .service-tabs-container .service-search-input:focus{ border-color:var(--violet) !important; background:#fff !important; box-shadow:0 0 0 3px var(--violet-tint) !important; }

/* day card: drop the legacy red left stripe (the day ribbon now flags pending) */
.aib-redesign .aib-day.sarisara-custom-day-flag > .aib-day-header,
.aib-redesign .aib-day.sarisara-custom-day-flag .aib-day-header{ border-left:0 !important; }

/* ============================================================
   MESSAGES — one modern style for ALL builder warnings / errors /
   success / info notices, toasts and banners (replaces the old
   full-width coloured bars). Severity sets the colour:
     default/warning = amber · error = red · success = green · info = grey
   Beats overrides.css (1329+, 2374) via .aib-redesign + !important.
   ============================================================ */
.aib-redesign .date-warning,
.aib-redesign .date-continuity-warning,
.aib-redesign .empty-day-warning,
.aib-redesign .airport-transfer-warning,
.aib-redesign .combined-day-warning,
.aib-redesign .aib-refresh-message,
.aib-redesign .alert{
  display:flex !important; align-items:flex-start; gap:9px;
  font-size:12.5px !important; font-weight:500 !important; line-height:1.5;
  border-radius:10px !important; padding:11px 13px !important; margin:10px 0 !important;
  background:#fff6e0 !important; border:1px solid #f0dca8 !important; color:#6b5410 !important;
  box-shadow:none !important; text-transform:none !important;
}
/* error / danger */
.aib-redesign .date-warning.error,
.aib-redesign .airport-transfer-warning.error,
.aib-redesign .combined-day-warning.error,
.aib-redesign .alert-danger{
  background:var(--danger-tint) !important; border-color:#f0c4c0 !important; color:#8a2018 !important;
}
/* success */
.aib-redesign .date-warning.success,
.aib-redesign .empty-day-warning.success,
.aib-redesign .date-continuity-warning.success,
.aib-redesign .airport-transfer-warning.success,
.aib-redesign .combined-day-warning.success{
  background:#e9f7e8 !important; border-color:#bfe6bd !important; color:#1f6b1c !important;
}
/* icons */
.aib-redesign .date-warning .dashicons-warning,
.aib-redesign .date-continuity-warning .dashicons-warning,
.aib-redesign .empty-day-warning .dashicons-warning,
.aib-redesign .airport-transfer-warning .dashicons-warning,
.aib-redesign .combined-day-warning .dashicons-warning{
  color:#caa53a !important; font-size:16px !important; width:16px !important; height:16px !important; line-height:16px !important; flex:none; margin-top:1px;
}
.aib-redesign .date-warning.error .dashicons-warning,
.aib-redesign .airport-transfer-warning.error .dashicons-warning,
.aib-redesign .combined-day-warning.error .dashicons-warning{ color:var(--danger) !important; }
.aib-redesign .date-warning.success .dashicons-warning,
.aib-redesign .empty-day-warning.success .dashicons-warning,
.aib-redesign .combined-day-warning.success .dashicons-warning{ color:#0ba300 !important; }
/* message text */
.aib-redesign .warning-message{ font-weight:600 !important; color:inherit !important; font-size:12.5px !important; }
.aib-redesign .warning-details{ color:inherit !important; opacity:.85; font-size:11.5px !important; display:block; margin-top:2px; }
.aib-redesign .warning-content{ flex:1; min-width:0; }
.aib-redesign .warning-content strong{ color:inherit !important; }
.aib-redesign .empty-day-warning .warning-actions{ margin-left:auto; display:flex; gap:6px; flex:none; }
.aib-redesign .empty-day-warning .button-small{ border-radius:8px !important; }

/* toast (showNotification: .aib-notification-info/success/error/warning) */
.aib-notification{
  border-radius:10px !important; padding:11px 14px !important; font-size:13px !important; font-weight:600 !important;
  border:1px solid var(--line-2, #dcdcd9) !important; background:#fff !important; color:#1a1a1d !important;
  box-shadow:0 4px 18px -8px rgba(20,20,30,.18) !important; margin:0 0 10px !important; line-height:1.45;
  font-family:'Google Sans',system-ui,sans-serif;
}
.aib-notification-success{ background:#e9f7e8 !important; border-color:#bfe6bd !important; color:#1f6b1c !important; }
.aib-notification-error{ background:#fdecea !important; border-color:#f0c4c0 !important; color:#8a2018 !important; }
.aib-notification-warning{ background:#fff6e0 !important; border-color:#f0dca8 !important; color:#6b5410 !important; }
.aib-notification-info{ background:#fafafa !important; border-color:#dcdcd9 !important; color:#3a3a40 !important; }

/* publish-hold gate banner -> danger notice */
.aib-redesign .sarisara-custom-gate-banner{
  background:var(--danger-tint) !important; border:1px solid #f0c4c0 !important; color:#8a2018 !important;
  border-radius:10px !important; padding:12px 14px !important; margin:0 0 14px !important;
  font-size:12.5px !important; font-weight:500 !important; line-height:1.55; box-shadow:none !important;
}
.aib-redesign .sarisara-custom-gate-banner strong{ color:#8a2018 !important; }

/* small inline "Limited availability" tag */
.aib-redesign .room-availability-warning{
  display:inline-block; background:#fff6e0 !important; color:#6b5410 !important; border:1px solid #f0dca8 !important;
  border-radius:6px !important; padding:1px 7px !important; font-size:11px !important; font-weight:600 !important;
}

/* ============================================================
   CARD MESSAGE RIBBON — the unified in-card message UI. ONE ribbon
   pokes up from the top-centre of a service OR day card (same family
   as the Pending Publishing ribbon). The host gets .has-msg-ribbon,
   which (a) lets the card overflow so the ribbon shows above it and
   (b) adds +10px top padding to the header so there's room between
   the ribbon and the header content.
     error = red · warning = amber · success = green · info = violet
   ============================================================ */
.aib-redesign .aib-card-ribbon{
  position:absolute; top:-11px; left:50%; transform:translateX(-50%); z-index:8;
  display:inline-flex; align-items:center; justify-content:center; text-align:center;
  max-width:calc(100% - 40px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  /* top:-11px clips ~11px; padding-top 15px -> small gap between the cut edge and text */
  padding:15px 20px 5px; border-radius:0 0 12px 12px;
  font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:#fff;
  pointer-events:none; /* re-enabled for .clickable below */
}
.aib-redesign .aib-card-ribbon.clickable{ pointer-events:auto; cursor:pointer; }
.aib-redesign .aib-card-ribbon.error{   background:#FF0A1F; box-shadow:0 5px 9px -3px rgba(255,10,31,.35); }
.aib-redesign .aib-card-ribbon.warning{ background:#F2A024; box-shadow:0 5px 9px -3px rgba(242,160,36,.35); }
.aib-redesign .aib-card-ribbon.success{ background:#2BA23C; box-shadow:0 5px 9px -3px rgba(43,162,60,.35); }
.aib-redesign .aib-card-ribbon.info{    background:var(--violet); box-shadow:0 5px 9px -3px rgba(119,0,255,.3); }
/* NEUTRAL — Chiran, 1 Sep 2026: "you can use a very light gray to represent
   messages which is not a warning, not an error, not a success message, but just
   a general message." Dark ink on grey, since white on light grey is unreadable. */
.aib-redesign .aib-card-ribbon.neutral{ background:#E7E7EE; color:#3A3A4A; box-shadow:0 5px 9px -3px rgba(9,9,32,.14); }

/* ── ACTIONS INSIDE THE RIBBON ────────────────────────────────────────────
   Chiran, 1 Sep 2026: "we cannot exactly add the button with the padding, but
   we can include it as a link — just the wording, not the background padding
   area, with an icon in front. Accept is a check mark, reject is a cross."

   So they are LINKS, not buttons: no fill, no padding box, just an icon and a
   word that underlines on hover. A padded button inside the ribbon would make
   it taller, and the ribbon's entire value is that it adds no height to the
   card. Keeping them as links is what preserves that.                        */
.aib-redesign .aib-card-ribbon{ gap:0; }
.aib-redesign .aib-card-ribbon.has-actions{ white-space:nowrap; }
.aib-redesign .aib-ribbon-text{ overflow:hidden; text-overflow:ellipsis; }
.aib-redesign .aib-ribbon-acts{ display:inline-flex; align-items:center; gap:14px; margin-left:14px; pointer-events:auto; }
.aib-redesign .aib-ribbon-act{
  /* A <button> keeps the browser's own surface unless it is told not to, which
     painted a pale block behind the link inside the red ribbon. */
  appearance:none; -webkit-appearance:none; background-color:transparent !important;
  box-shadow:none !important; border-radius:0;
  display:inline-flex; align-items:center; gap:4px;
  font:inherit; letter-spacing:inherit; text-transform:inherit;
  color:inherit; background:none; border:0; padding:0; cursor:pointer;
  opacity:.92; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.45);
}
.aib-redesign .aib-card-ribbon.neutral .aib-ribbon-act{ border-bottom-color:rgba(9,9,32,.28); }
.aib-redesign .aib-ribbon-act:hover{ opacity:1; border-bottom-color:currentColor; }
.aib-redesign .aib-ribbon-act .svgico,
.aib-redesign .aib-ribbon-act svg{ width:12px; height:12px; }
/* A divider between the message and its actions, so the eye separates them. */
.aib-redesign .aib-ribbon-acts::before{
  content:''; width:1px; height:11px; margin-right:14px;
  background:rgba(255,255,255,.4); display:inline-block;
}
.aib-redesign .aib-card-ribbon.neutral .aib-ribbon-acts::before{ background:rgba(9,9,32,.22); }

/* Host with a ribbon: cards KEEP overflow:hidden so the ribbon's TOP is cut at
   the card edge (tucked look). Add +10px to the header top padding so there's a
   gap between the tucked ribbon and the header content. */
.aib-redesign .service-component.has-msg-ribbon > .service-header,
.aib-redesign .service-component.sarisara-custom-flag > .service-header{ padding-top:30px !important; }
.aib-redesign .aib-day.has-msg-ribbon > .aib-day-header{ padding-top:34px !important; }

/* ============================================================
   ADD-SERVICE PICKERS (hi-fi): inline picker rendered into
   .aib-picker-slot — header + searchbar + filters + results,
   and the custom-service form. Ports the mockup .picker.
   ============================================================ */
.aib-redesign .aib-picker-slot:empty{ display:none; }
.aib-redesign .aib-picker{ margin-top:13px; border:1px solid var(--line-2); border-radius:var(--radius-sm); background:#fff; box-shadow:var(--shadow); overflow:visible; }
.aib-redesign .aib-picker-head{ border-radius:var(--radius-sm) var(--radius-sm) 0 0; }
/* let a filter dropdown escape the day card's overflow while it's open */
.aib-redesign .aib-day.aib-ddopen{ overflow:visible !important; }
/* filter label sits right above its field (was a wide gap) */
.aib-redesign .aib-day-body .aib-filters .aib-filter-grp > label{ margin:0 0 4px !important; }
.aib-redesign .aib-day-body .aib-filters .aib-filter-grp{ gap:0 !important; }
.aib-redesign .aib-picker-head{ display:flex; align-items:center; gap:12px; padding:14px 16px; border-bottom:1px solid var(--line); }
.aib-redesign .aib-ph-icon{ width:36px; height:36px; border-radius:10px; display:grid; place-items:center; flex:none; }
.aib-redesign .aib-ph-icon .svgico{ width:19px; height:19px; }
.aib-redesign .aib-ph-icon.ph-hotel{ background:var(--hotel-tint); color:var(--hotel); }
.aib-redesign .aib-ph-icon.ph-activity{ background:var(--act-tint); color:var(--act); }
.aib-redesign .aib-ph-icon.ph-custom{ background:var(--custom-tint); color:var(--custom); }
.aib-redesign .aib-ph-text{ flex:1; min-width:0; }
.aib-redesign .aib-ph-text h4{ margin:0; font-size:14.5px; font-weight:700; color:var(--ink); }
.aib-redesign .aib-ph-text p{ margin:1px 0 0; font-size:12px; color:var(--muted); }
.aib-redesign .aib-picker-close{ margin-left:auto; width:30px; height:30px; border-radius:8px; border:1px solid var(--line) !important; background:#fff !important; color:var(--muted); cursor:pointer; display:grid !important; place-items:center; flex:none; box-shadow:none; padding:0 !important; }
.aib-redesign .aib-picker-close:hover{ background:var(--bg) !important; color:var(--ink); }
.aib-redesign .aib-picker-close .svgico{ width:16px; height:16px; }
.aib-redesign .aib-picker-body{ padding:14px 16px; }

/* searchbar */
.aib-redesign .aib-searchbar{ display:flex; align-items:center; gap:10px; border:1px solid var(--line-2); border-radius:10px; padding:11px 14px; margin-bottom:13px; background:var(--field-bg); transition:var(--t); }
.aib-redesign .aib-searchbar:focus-within{ border-color:var(--violet); background:#fff; box-shadow:0 0 0 3px var(--violet-tint); }
.aib-redesign .aib-searchbar .svgico{ width:17px; height:17px; color:var(--faint); flex:none; }
.aib-redesign .aib-searchbar .service-search-input{ border:0 !important; outline:none; flex:1; font-size:14.5px !important; font-family:inherit; background:transparent !important; color:var(--ink) !important; padding:0 !important; box-shadow:none !important; height:auto !important; }

/* filters */
.aib-redesign .aib-filters{ display:flex; gap:15px; flex-wrap:wrap; align-items:flex-end; margin-bottom:14px; }
.aib-redesign .aib-filter-grp{ display:flex; flex-direction:column; gap:7px; }
.aib-redesign .aib-filter-grp > label{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.aib-redesign .aib-filter-grp select{ border:1px solid var(--line-2) !important; border-radius:10px !important; padding:9px 12px !important; font-size:13.5px !important; font-family:inherit; background:#fff !important; color:var(--ink) !important; min-width:120px; height:auto !important; }
.aib-redesign .aib-price-range{ display:flex; align-items:center; gap:8px; }
.aib-redesign .aib-price-range input{ width:74px; border:1px solid var(--line-2) !important; border-radius:10px !important; padding:9px 12px !important; font-size:13.5px !important; font-family:inherit; background:#fff !important; color:var(--ink) !important; height:auto !important; box-sizing:border-box; }
.aib-redesign .aib-price-range span{ color:var(--faint); }
.aib-redesign .aib-seg{ display:inline-flex; background:var(--field-bg); border:1px solid var(--line); border-radius:var(--radius-pill); padding:3px; }
.aib-redesign .aib-seg button{ border:0 !important; background:transparent !important; padding:7px 13px !important; border-radius:var(--radius-pill) !important; font-size:12.5px !important; font-weight:600; color:var(--muted) !important; cursor:pointer; font-family:inherit; transition:var(--t); box-shadow:none; height:auto; }
.aib-redesign .aib-seg button.on{ background:#fff !important; color:var(--ink) !important; box-shadow:var(--shadow-sm); }

/* custom form */
.aib-redesign .aib-cform{ display:grid; gap:13px; }
.aib-redesign .aib-cform .aib-frow{ display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.aib-redesign .aib-cform .aib-field{ display:flex; flex-direction:column; gap:6px; }
.aib-redesign .aib-cform .aib-field > label{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.aib-redesign .aib-cform .aib-field .req{ color:var(--custom); }
.aib-redesign .aib-cform input, .aib-redesign .aib-cform select, .aib-redesign .aib-cform textarea{ border:1px solid var(--line-2) !important; border-radius:10px !important; padding:10px 12px !important; font-size:14px !important; font-family:inherit; outline:none; background:#fff !important; color:var(--ink) !important; width:100%; box-sizing:border-box; height:auto !important; }
.aib-redesign .aib-cform input:focus, .aib-redesign .aib-cform select:focus, .aib-redesign .aib-cform textarea:focus{ border-color:var(--violet) !important; box-shadow:0 0 0 3px var(--violet-tint) !important; }
.aib-redesign .aib-cform .custom-type-notice{ display:flex; gap:9px; align-items:flex-start; font-size:12.5px; border-radius:10px; padding:11px 13px; line-height:1.5; background:var(--field-bg); color:var(--ink-soft); border:1px solid var(--line-2); }
.aib-redesign .aib-cform .custom-type-notice .svgico{ width:15px; height:15px; flex:none; margin-top:1px; color:var(--faint); }
.aib-redesign .aib-cform-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:2px; }
.aib-redesign .aib-cform-actions .button{ border-radius:9px !important; padding:9px 18px !important; font-weight:600; box-shadow:none !important; height:auto !important; }
.aib-redesign .aib-cform-actions .aib-picker-cancel{ background:#fff !important; border:1px solid var(--line-2) !important; color:var(--ink-soft) !important; }
.aib-redesign .aib-cform-actions .aib-custom-add{ background:var(--black) !important; border:1px solid var(--black) !important; color:#fff !important; }
.aib-redesign .aib-cform-actions .aib-custom-add:hover{ background:var(--black-700) !important; }

/* ---- picker result cards (hi-fi) ---- */
.aib-redesign .search-dropdown.aib-results{ position:static !important; box-shadow:none !important; border:0 !important; background:transparent !important; max-height:none !important; margin-top:13px; padding:0 !important; }
.aib-redesign .aib-res-count{ font-size:12px; font-weight:600; color:var(--muted); margin-bottom:10px; }
.aib-redesign .aib-res-empty{ font-size:13px; color:var(--muted); padding:14px 4px; }
.aib-redesign .aib-res{ display:flex; align-items:center; gap:13px; border:1px solid var(--line); border-radius:var(--radius-sm); padding:12px 14px; margin-bottom:10px; background:#fff; transition:var(--t); position:relative; overflow:hidden; }
.aib-redesign .aib-res:hover{ box-shadow:var(--shadow-sm); border-color:var(--line-2); }
.aib-redesign .aib-res::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; }
.aib-redesign .aib-res.t-hotel::before{ background:var(--hotel); }
.aib-redesign .aib-res.t-activity::before{ background:var(--act); }
.aib-redesign .aib-res.t-curated::before{ background:var(--cur); }
.aib-redesign .aib-res-icon{ width:44px; height:44px; border-radius:11px; display:grid; place-items:center; flex:none; }
.aib-redesign .aib-res-icon .svgico{ width:21px; height:21px; }
.aib-redesign .aib-res-icon.t-hotel{ background:var(--hotel-tint); color:var(--hotel); }
.aib-redesign .aib-res-icon.t-activity{ background:var(--act-tint); color:var(--act); }
.aib-redesign .aib-res-icon.t-curated{ background:var(--cur-tint); color:var(--cur); }
.aib-redesign .aib-res-main{ flex:1; min-width:0; }
.aib-redesign .aib-res-name{ font-size:15px; font-weight:700; color:var(--ink); display:flex; align-items:center; gap:8px; }
.aib-redesign .aib-res-badge{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:2px 7px; border-radius:6px; }
.aib-redesign .aib-res-badge.sltda{ background:var(--act-tint); color:var(--act); }
.aib-redesign .aib-res-badge.cur{ background:var(--cur-tint); color:var(--cur); }
/* SLTDA Home Stay badge (category label on picker cards) — green = community/authentic */
.aib-redesign .aib-res-badge.hs{ background:rgba(48,179,0,.12); color:#1f7a00; }
/* "SLTDA-standards-compliant" mark (Phase 6 QA moat) — gold = verified quality */
.aib-redesign .aib-res-badge.hs-compliant{ background:rgba(255,183,0,.15); color:#8a6400; }
.aib-redesign .aib-res-hs{ color:#1f7a00; font-weight:600; }
/* Home Stay category chip in the hotel component header (replaces the star class) */
.hclass-hs{ color:#1f7a00; font-weight:600; font-style:normal; }
/* Legacy list-dropdown home-stay pill (mirrors curator-badge--sm) */
.homestay-badge{ display:inline-block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:2px 7px; border-radius:6px; background:rgba(48,179,0,.12); color:#1f7a00; }
.aib-redesign .aib-res-meta{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:12.5px; color:var(--muted); margin-top:3px; }
.aib-redesign .aib-res-meta .svgico{ width:13px; height:13px; color:var(--faint); }
.aib-redesign .aib-res-dot{ width:3px; height:3px; border-radius:50%; background:#cdcdce; display:inline-block; }
.aib-redesign .aib-res-stars{ color:#FFB700; letter-spacing:1px; }
.aib-redesign .aib-res-rate{ color:var(--ink-soft); font-weight:600; }
.aib-redesign .aib-res-right{ display:flex; align-items:center; gap:14px; flex:none; }
.aib-redesign .aib-res-price{ text-align:right; }
.aib-redesign .aib-res-price b{ display:block; font-size:14.5px; font-weight:700; color:var(--ink-soft); }
.aib-redesign .aib-res-price small{ display:block; font-size:10.5px; color:var(--muted); }
.aib-redesign .aib-res-add{ border:0 !important; background:var(--black) !important; color:#fff !important; font-weight:700; font-size:13px; border-radius:9px; padding:9px 18px !important; cursor:pointer; font-family:inherit; transition:var(--t); box-shadow:none; height:auto; }
.aib-redesign .aib-res-add:hover{ background:var(--black-700) !important; }

/* ---- picker fixes: button case, bigger add, spacing, custom dropdowns ---- */
/* #1 add-row + result Add buttons: never uppercase */
.aib-redesign .aib-add-btn,
.aib-redesign .aib-res-add{ text-transform:none !important; letter-spacing:0 !important; }
/* #6 result Add button bigger (match hi-fi) */
.aib-redesign .aib-res-add{ font-size:13.5px !important; padding:11px 24px !important; border-radius:10px !important; }

/* #2 filters: title closer to its field, more air under the searchbar */
.aib-redesign .aib-searchbar{ margin-bottom:18px; }
.aib-redesign .aib-filters{ align-items:flex-start; }
.aib-redesign .aib-filter-grp{ gap:6px; }

/* #3/#5 modern custom dropdown (area + stars) */
.aib-redesign .aib-dd{ position:relative; }
.aib-redesign .aib-dd-toggle{ display:flex; align-items:center; gap:10px; min-width:150px; width:100%; border:1px solid var(--line-2) !important; background:#fff !important; border-radius:10px !important; padding:9px 12px !important; font-size:13.5px !important; font-weight:600; color:var(--ink) !important; cursor:pointer; font-family:inherit; transition:var(--t); box-shadow:none; height:auto; }
.aib-redesign .aib-dd-toggle:hover{ border-color:#c9c9c5 !important; }
.aib-redesign .aib-dd.open .aib-dd-toggle{ border-color:var(--violet) !important; box-shadow:0 0 0 3px var(--violet-tint); }
.aib-redesign .aib-dd-toggle .aib-dd-val{ flex:1; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aib-redesign .aib-dd-toggle .svgico{ width:15px; height:15px; color:var(--faint); flex:none; transition:transform var(--t); }
.aib-redesign .aib-dd.open .aib-dd-toggle .svgico{ transform:rotate(180deg); }
.aib-redesign .aib-dd-menu{ display:none; position:absolute; top:calc(100% + 6px); left:0; min-width:100%; z-index:20; background:#fff; border:1px solid var(--line-2); border-radius:11px; box-shadow:var(--shadow); padding:6px; }
.aib-redesign .aib-dd.open .aib-dd-menu{ display:block; }
.aib-redesign .aib-dd-search-wrap{ display:flex; align-items:center; gap:8px; border:1px solid var(--line-2); border-radius:8px; padding:7px 10px; margin-bottom:6px; background:var(--field-bg); }
.aib-redesign .aib-dd-search-wrap .svgico{ width:14px; height:14px; color:var(--faint); flex:none; }
.aib-redesign .aib-dd-search{ border:0 !important; outline:none; flex:1; font-size:13px !important; font-family:inherit; background:transparent !important; color:var(--ink) !important; padding:0 !important; box-shadow:none !important; height:auto !important; }
.aib-redesign .aib-dd-options{ max-height:198px; overflow-y:auto; overscroll-behavior:contain; }
.aib-redesign .aib-dd-opt{ padding:8px 10px; border-radius:8px; font-size:13.5px; font-weight:600; color:var(--ink-soft); cursor:pointer; white-space:nowrap; }
.aib-redesign .aib-dd-opt:hover{ background:var(--field-bg); color:var(--ink); }
.aib-redesign .aib-dd-opt.is-sel{ background:var(--violet-tint); color:var(--violet); }

/* unify filter control heights (area / stars / price) and the result Add button */
.aib-redesign .aib-filters .aib-dd-toggle,
.aib-redesign .aib-filters .aib-price-range input{ height:40px !important; padding:0 12px !important; box-sizing:border-box !important; }
.aib-redesign .aib-filters .aib-dd-toggle{ display:flex !important; align-items:center; }
.aib-redesign .aib-filters .aib-price-range{ height:40px; align-items:center; }
.aib-redesign .aib-res-add{ height:40px !important; padding:0 24px !important; display:inline-flex !important; align-items:center; justify-content:center; font-size:13.5px !important; border-radius:9px !important; }

/* ensure the selected dropdown value always renders (no flex-collapse / button quirks) */
.aib-redesign .aib-dd-toggle .aib-dd-val{ flex:1 1 auto !important; min-width:0; display:inline-block !important; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink) !important; font-size:13.5px !important; font-weight:600 !important; line-height:1.2; visibility:visible !important; text-transform:capitalize !important; letter-spacing:0 !important; }

/* activity SOURCE segment: match the 40px field height + icons, title-case */
.aib-redesign .aib-filters .aib-seg{ height:40px !important; box-sizing:border-box; align-items:center; padding:4px !important; }
.aib-redesign .aib-filters .aib-seg button{ display:inline-flex !important; align-items:center; gap:6px; height:32px !important; padding:0 14px !important; text-transform:none !important; letter-spacing:0 !important; font-size:13px !important; }
.aib-redesign .aib-filters .aib-seg button .svgico{ width:15px; height:15px; color:var(--faint); }
.aib-redesign .aib-filters .aib-seg button.on .svgico{ color:inherit; }

/* active SOURCE pill colours: SLTDA = green, Curators = bronze (white text+icon) */
.aib-redesign .aib-filters .aib-seg button[data-src="activity"].on{ background:var(--act) !important; color:#fff !important; box-shadow:none !important; }
.aib-redesign .aib-filters .aib-seg button[data-src="curator"].on{ background:var(--cur) !important; color:#fff !important; box-shadow:none !important; }
.aib-redesign .aib-filters .aib-seg button[data-src="activity"].on .svgico,
.aib-redesign .aib-filters .aib-seg button[data-src="curator"].on .svgico{ color:#fff !important; }

/* ---- custom picker polish (images 159-164) ---- */
/* #3 label sits right above its field (reduce gap); rows keep their spacing */
.aib-redesign .aib-cform .aib-field{ gap:4px !important; }
.aib-redesign .aib-day-body .aib-cform .aib-field > label{ margin:0 !important; }
/* #2 Cancel / Add to day buttons: title-case, proper size (not squeezed) */
.aib-redesign .aib-cform-actions{ margin-top:6px; }
.aib-redesign .aib-cform-actions .button{ text-transform:none !important; letter-spacing:0 !important; height:40px !important; padding:0 24px !important; display:inline-flex !important; align-items:center; justify-content:center; line-height:1; font-size:14px !important; font-weight:600; border-radius:9px !important; box-shadow:none !important; }
.aib-redesign .aib-cform-actions .aib-picker-cancel{ background:#fff !important; border:1px solid var(--line-2) !important; color:var(--ink-soft) !important; }
.aib-redesign .aib-cform-actions .aib-custom-add{ background:var(--black) !important; border:1px solid var(--black) !important; color:#fff !important; }
.aib-redesign .aib-cform-actions .aib-custom-add:hover{ background:var(--black-700) !important; }
/* #5 frozen add buttons while a picker is open */
.aib-redesign .aib-add-btn:disabled{ opacity:.45 !important; cursor:not-allowed !important; background:#fafafa !important; }

/* custom picker lock (warning) notice -> terracotta tint, matching the service card */
.aib-redesign .aib-cform .custom-type-notice--warning{ background:var(--custom-tint) !important; color:#7a3d33 !important; border:1px solid #e7c4bc !important; }
.aib-redesign .aib-cform .custom-type-notice--warning .svgico{ color:var(--custom) !important; }

/* custom picker: disabled Add button + inline phone/email validation messages */
.aib-redesign .aib-cform-actions .aib-custom-add:disabled{ opacity:.45 !important; cursor:not-allowed !important; background:var(--black) !important; }
.aib-redesign .aib-cform .cpk-msg{ display:block; color:var(--danger); font-size:11.5px; font-weight:600; margin-top:4px; min-height:1px; }
.aib-redesign .aib-cform input.field-error{ border-color:var(--danger) !important; box-shadow:0 0 0 3px var(--danger-tint) !important; }

/* #3 added custom SERVICE component: tighten label->field gap (same as the picker) */
.aib-redesign .service-custom .service-field{ gap:4px !important; }
.aib-redesign .aib-day-body .service-custom .service-field > label{ margin:0 !important; }
.aib-redesign .service-custom .custom-fields-grid .service-field{ gap:4px !important; }

/* ============================================================
   UNLOCKED DATE PICKER + DATE-LESS EVENT CUSTOMS (locked Chiran 2026-06-21)
   Dates are no longer "auto from nights only". Every DATED service (hotel,
   activity, curator, custom hotel/activity) has a clickable date chip that
   opens the native picker so the guide can override the concurrent default.
   Event-based custom services (transport/meal/guide/other) have NO date.
   ============================================================ */
/* Re-enable interaction on dated chips (overrides the earlier read-only lock). */
.aib-redesign .dt-chip-date{ position:relative !important; pointer-events:auto !important; cursor:pointer !important; }
.aib-redesign .dt-chip-date:hover{ border-color:var(--accent,#7700FF) !important; }
.aib-redesign .dt-chip-date:hover .dt-ico{ color:var(--accent,#7700FF) !important; }
/* The real <input type=date> is overlaid TRANSPARENTLY across the whole chip so a
   click reliably lands on the native control (the formatted display shows through
   underneath). This is robust regardless of showPicker quirks. */
.aib-redesign .dt-chip-date .service-date-input,
.aib-redesign .dt-chip-date .activity-date-input{
  display:block !important; position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important; min-width:0 !important;
  margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important;
  opacity:0 !important; cursor:pointer !important; pointer-events:auto !important; z-index:3 !important;
  -webkit-appearance:none !important; appearance:none !important;
}
/* keep the chip's calendar icon + formatted date visible under the transparent input */
.aib-redesign .dt-chip-date .dt-ico,
.aib-redesign .dt-chip-date .service-date-display,
.aib-redesign .dt-chip-date .activity-date-display,
.aib-redesign .dt-chip-date .service-date-placeholder,
.aib-redesign .dt-chip-date .activity-date-placeholder{ position:relative; z-index:1; pointer-events:none; }
/* Event-based custom services: no date chip at all (price-only). */
.aib-redesign .service-custom.custom-no-date .service-date-wrapper{ display:none !important; }

/* Equal pill height across ALL service types (hotel date/time pills were a touch
   shorter than the activity pills). One rule on .dt-chip covers hotel + activity +
   custom so they always match. (Chiran 2026-06-21.) */
.aib-redesign .dt-chip,
.aib-redesign .service-component.t-hotel .dt-chip{
  min-height:38px !important; box-sizing:border-box !important; align-items:center !important;
}

/* ============================================================
   Minimalist brand CALENDAR popover (locked Chiran 2026-06-21)
   Matches the time popover (.aib-timepop): white card, soft shadow,
   'Google Sans', violet #7700FF accent. Appended to <body>, so NOT under
   .aib-redesign. Replaces the native date picker on the date chip.
   ============================================================ */
.aib-datepop{ position:fixed; z-index:100000; background:#fff; border:1px solid #dcdcd9; border-radius:14px;
  box-shadow:0 14px 38px -16px rgba(20,20,30,.32); width:262px; padding:12px; box-sizing:border-box; overflow:hidden;
  font-family:'Google Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif; animation:aibpop .14s ease; }
/* Neutralise WP-admin / theme <button> styling that would otherwise blow the
   7-column grid wide (admin buttons carry min-width/padding/min-height). */
.aib-datepop button{ -webkit-appearance:none !important; appearance:none !important; box-sizing:border-box !important;
  min-width:0 !important; max-width:none !important; min-height:0 !important; margin:0 !important; line-height:1 !important;
  box-shadow:none !important; text-shadow:none !important; }
.aib-datepop .dp-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.aib-datepop .dp-title{ font-size:13.5px; font-weight:700; color:#1a1a1d; letter-spacing:.01em; }
.aib-datepop .dp-nav{ width:28px !important; height:28px !important; border:1px solid #e8e8e6 !important; background:#fff !important; border-radius:8px !important;
  font-size:16px; line-height:1; color:#3a3a40; cursor:pointer; display:grid !important; place-items:center; padding:0 !important;
  transition:background .12s,border-color .12s,color .12s; flex:0 0 auto; }
.aib-datepop .dp-nav:hover{ background:#7700FF !important; border-color:#7700FF !important; color:#fff !important; }
.aib-datepop .dp-dow{ display:grid !important; grid-template-columns:repeat(7,1fr) !important; gap:2px; margin-bottom:4px; width:100%; }
.aib-datepop .dp-dow-cell{ text-align:center; font-size:10px; font-weight:700; text-transform:uppercase; color:#9a9aa3; padding:2px 0; min-width:0; overflow:hidden; }
.aib-datepop .dp-grid{ display:grid !important; grid-template-columns:repeat(7,1fr) !important; gap:2px; width:100%; }
.aib-datepop .dp-cell{ height:30px; min-width:0 !important; }
.aib-datepop .dp-empty{ background:transparent; }
.aib-datepop button.dp-day{ border:0 !important; background:transparent; border-radius:8px !important; font-size:12.5px; font-weight:600;
  color:#3a3a40; cursor:pointer; font-family:inherit; display:grid !important; place-items:center; height:30px; width:100% !important;
  padding:0 !important; transition:background .12s,color .12s; }
.aib-datepop button.dp-day:hover{ background:#f1ecff; color:#7700FF; }
.aib-datepop button.dp-day.on{ background:#7700FF; color:#fff; }

/* Builder section helper note (Chiran 2026-07-21) */
p.hs-exp-builder-note { margin: 20px 0; }

/* ============================================================================
   DATE WARNINGS — FLAG, NEVER REORDER
   ----------------------------------------------------------------------------
   The builder used to sort a day's services by date, which silently tore apart
   an order the guide had set deliberately. Now the order is theirs and we just
   point at a date that looks wrong, so they can correct it themselves.
   ========================================================================== */
.aib-redesign .service-component.aib-date-warning{
    border-color:#FFB700 !important;
    box-shadow:0 0 0 1px #FFB700 inset, 0 2px 10px rgba(255,183,0,.16);
    background:#FFFBF0;
}
.aib-redesign .aib-date-flag{
    display:inline-flex; align-items:center; gap:5px;
    margin-left:8px; padding:3px 9px;
    border-radius:999px;
    background:#FFB700; color:#090920;
    font-size:11px; font-weight:700; line-height:1.2;
    white-space:nowrap; cursor:help; vertical-align:middle;
}
.aib-redesign .aib-date-flag svg{ flex:0 0 auto; }
@media (max-width:640px){
    .aib-redesign .aib-date-flag-text{ display:none; }   /* icon alone on small screens */
    .aib-redesign .aib-date-flag{ padding:3px 6px; }
}

/* ==========================================================================
   EXPAND / COLLAPSE ALL DAYS
   Two quiet links above the builder. A twelve-day itinerary is a lot of
   scrolling to reach one leg.
   ========================================================================== */
.aib-bulk-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-end;
    /* Line up with the Refresh button above, which carries the same 15px
       side padding — without it the links sat outside the panel edge. */
    padding: 0 15px;
    margin: 4px 0 14px;
}

.aib-bulk-toggle .aib-bulk-link {
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    font-family: 'Google Sans', system-ui, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #7700FF;
    cursor: pointer;
    line-height: 1.3;
    text-transform: none;
    letter-spacing: 0;
}

.aib-bulk-toggle .aib-bulk-link:hover,
.aib-bulk-toggle .aib-bulk-link:focus {
    color: #5a00c2;
    text-decoration: underline;
    background: none;
}

.aib-bulk-toggle .aib-bulk-sep {
    color: #c8c8d4;
    font-size: 13px;
}

/* ── DATE-AWARE PICKER (Chiran, 1 Sep 2026) ────────────────────────────────
   Is this actually free on the day the guide is filling? Three states, in the
   brand palette: green free, gold nearly gone, red taken. A listing we cannot
   answer for shows NOTHING at all — silence is the honest answer, and a fourth
   grey "unknown" chip would only teach guides to ignore the row.            */
.aib-redesign .aib-res-avail{
    font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
    padding:2px 7px; border-radius:6px; margin-left:6px; white-space:nowrap;
}
.aib-redesign .aib-res-avail.is-available{ background:rgba(48,179,0,.12); color:#228A00; }
.aib-redesign .aib-res-avail.is-limited  { background:rgba(255,183,0,.18); color:#8A6A2F; }
.aib-redesign .aib-res-avail.is-taken    { background:rgba(255,10,31,.10); color:#D11020; }

/* A taken listing is still ADDABLE — the guide may know something the calendar
   does not, and a provider who simply has not filled their calendar in must not
   be unreachable. It just stops looking like the obvious choice. */
.aib-redesign .aib-res-add.is-taken{ opacity:.55; }
.aib-redesign .aib-res-add.is-taken:hover{ opacity:1; }

/* ---------- "My Wishlist" picker toggle (moved from itinerary-builder-overrides.css, 14 Oct 2026) ---------- */
/* P6 "My Wishlist" toggle in the hi-fi picker filter bar. Off = white pill with
 * a red heart; On = brand violet. Matches the picker's rounded control language. */
.aib-picker .aib-grp-wish .aib-flt-wish {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid rgba(9, 9, 32, 0.14);
    border-radius: 999px;
    background: #fff;
    color: #d33a4b;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1;
    text-transform: none;
}
/* Chiran, 12 September 2026: "instead of the border I need the entire button to
 * be changed into the red color... and the font color to the white color. So
 * when it pressed also it keeps the red color background as it is without
 * keeping the violet color."
 *
 * The button's own colour is the red it already wore; pressing it fills with
 * that red rather than switching to violet, so hover and pressed are the same
 * thing getting stronger instead of two unrelated states. */
.aib-picker .aib-grp-wish .aib-flt-wish:hover,
.aib-picker .aib-grp-wish .aib-flt-wish.on {
    background: #d33a4b;
    border-color: #d33a4b;
    color: #fff;
}