/*
 * /bts-2026 (resources/views/app/pages/bts-2026.blade.php): ProvisCommerce.ai
 * at Bengaluru Tech Summit 2026. Loaded after event.css and imc-2026.css, so
 * the page uses the same ev- and dp- design; only BTS-specific pieces are
 * here, prefixed bts-.
 */

/* ---------------------------------------------------------------- */
/* Hero screen: growth figures and the shop-journey statuses          */
/* ---------------------------------------------------------------- */
.bts-kpi--orders { background: #EEF4FF; }
.bts .dp-kpi b { color: var(--ev-ink); }
.bts-up { color: #03703F; }
.bts-bars i { background: #9ED9BC; }
.bts-bars i:nth-last-child(-n+3) { background: #3FBF86; }
.bts-bars i:last-child { background: var(--ev-green-dark); }
.bts-kpi--orders .bts-bars i { background: #B9CCF5; }
.bts-kpi--orders .bts-bars i:nth-last-child(-n+3) { background: #6F95E6; }
.bts-kpi--orders .bts-bars i:last-child { background: #2F5FD0; }

.dp-state.is-new { color: #1D4ED8; } .dp-state.is-new::before { background: #3B82F6; }
.dp-state.is-assigned { color: #92400E; } .dp-state.is-assigned::before { background: #F0A500; }
.dp-state.is-ordered { color: #03703F; } .dp-state.is-ordered::before { background: var(--ev-green); }
.bts .dp-table tr.is-first td { background: #EEF4FF; }
.bts .dp-table th:last-child, .bts .dp-table td:last-child { text-align: left; }
.bts .dp-state__note { max-width: 170px; }

/* ---------------------------------------------------------------- */
/* Problem: the reach illustration                                    */
/* ---------------------------------------------------------------- */

/* Drawn with /imc-2026's decline chart (event.css .ev-decline): green bars
   are the areas salesmen reach, amber the ones they don't, markers recoloured */
.bts-reach__mark--route { background: #DCFCE7; color: #166534; }
.bts-reach__mark--gap { background: #FEF3C7; color: #92400E; }
.bts-reach .ev-decline__bar.is-falling { opacity: .75; }
.bts-reach__note { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--ev-line); font-size: 14px; font-weight: 600; line-height: 1.5; color: var(--ev-ink); }

/* ---------------------------------------------------------------- */
/* The 50-retailer offer band (only once approved)                    */
/* ---------------------------------------------------------------- */
.bts-offer { padding: 36px 0; color: #fff; background: radial-gradient(ellipse at 100% 0%, rgba(0, 178, 107, .35), transparent 60%), var(--ev-dark-2); }
.bts-offer__inner { display: grid; gap: 20px; align-items: center; }
@media (min-width: 900px) { .bts-offer__inner { grid-template-columns: minmax(0, 1fr) auto; gap: 48px; } }
.bts-offer__title { margin: 0 0 10px; font-size: 30px; line-height: 1.2; font-weight: 700; letter-spacing: -.01em; }
.bts-offer__lead { margin: 0; max-width: 62ch; line-height: 1.6; color: rgba(255, 255, 255, .85); }
.bts-offer__small { margin: 10px 0 0; font-size: 12px; color: rgba(255, 255, 255, .55); }

/* ---------------------------------------------------------------- */
/* "How it helps" previews                                            */
/* ---------------------------------------------------------------- */
.bts-mini__new b { color: #1D4ED8 !important; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.bts-mini__new li span { background: #EEF4FF !important; border-color: #BFD3FB !important; color: #1D4ED8 !important; }
.bts-mini__price { font-size: 12px; color: var(--ev-muted); }
.bts-mini__price b { color: var(--ev-green-dark); font-size: 15px; }
.bts-mini__price s { margin-left: 4px; }
.bts-mini__btn { justify-self: start; padding: 6px 12px; border-radius: 8px; background: var(--ev-green); color: #fff; font-size: 12px; font-weight: 600; }
.bts-mini__target { display: grid; gap: 8px; }
.bts-mini__target p { display: flex; justify-content: space-between; gap: 8px; }
.bts-mini__target p span { font-size: 11px; color: var(--ev-muted); }
.bts-mini__target small { font-size: 12px; color: var(--ev-muted); }
.bts-mini__bar { display: block; height: 8px; border-radius: 999px; background: #fff; border: 1px solid var(--ev-line); overflow: hidden; }
.bts-mini__bar i { display: block; width: var(--w); height: 100%; background: var(--ev-green); }
.bts .dp-mini__call .dp-state { margin-left: 8px; }

/* ---------------------------------------------------------------- */
/* Form and "Meet us" date chips: 3 BTS days, after, any              */
/* ---------------------------------------------------------------- */
.bts-talk li::before { background-image: url("../img/ecommerce/icons/check-circle.svg"); filter: none; opacity: 1; }
.bts-dates { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.bts-pick { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.bts .dp-pick__legend .is-imc::before { background: var(--ev-green); }

/* ---------------------------------------------------------------- */
/* Phones                                                             */
/* ---------------------------------------------------------------- */
/* trust chips wrap: no separator dot at the start of a line */
.bts .dp-trust { gap: 6px 18px; }
.bts .dp-trust li + li::before { content: none; }
.bts .dp-screen__tag { white-space: nowrap; }
@media (max-width: 559px) {
  .bts .dp-screen__app { font-size: 16px; gap: 10px; }
  .bts .dp-screen__tag { padding: 5px 10px; font-size: 10px; }
}
/* the status is the point of the sample table: under 400px drop the
   salesman column instead (imc-2026.css hides the 4th column there) */
@media (max-width: 399px) {
  .bts .dp-table th:nth-child(4), .bts .dp-table td:nth-child(4) { display: table-cell; }
  .bts .dp-table th:nth-child(3), .bts .dp-table td:nth-child(3) { display: none; }
}
@media (max-width: 559px) {
  .bts .dp-table th:nth-child(3), .bts .dp-table td:nth-child(3) { display: none; }
}

/* ---------------------------------------------------------------- */
/* Spacing and fit fixes from the section-by-section check            */
/* ---------------------------------------------------------------- */

/* "How it helps" at small laptops: the 3-column card squeezed the text to
   ~4 words a line, so the heading goes on top and the card gets full width */
@media (min-width: 1024px) and (max-width: 1279px) {
  .bts .dp-get { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .bts .dp-get__head { position: static; }
  .bts .dp-get__head .ev-h2 { max-width: 22ch; }
}

/* proof: same band as /imc-2026 (one row of four, 2 x 2 below 900px) */

/* final CTA: "ProvisCommerce.ai." is one long word; keep the column inside
   the gutter on small phones */
.bts .ev-final__grid > * { min-width: 0; }
@media (max-width: 399px) { .bts .ev-final__title { font-size: 30px; } }
/* the contact email is longer than the IMC one: keep it on one line */
@media (max-width: 399px) { .bts .ev-person__ways span:last-child { font-size: 14px; overflow-wrap: normal; } }

/* WhatsApp permission (playbook: WhatsApp only after the person agrees) */
.ev-form .bts-consent { display: flex; align-items: flex-start; gap: 10px; margin: 16px 0 4px; font-size: 14px; font-weight: 500; line-height: 1.5; color: var(--ev-muted); cursor: pointer; }
.ev-form .bts-consent input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ev-green); }
.ev-form .bts-consent span { font-weight: 500; color: var(--ev-muted); }

/* ---------------------------------------------------------------- */
/* Also at our stand (Track B: services and partnerships)             */
/* ---------------------------------------------------------------- */
.bts-also__lead { margin: -8px 0 0; max-width: 60ch; font-size: 17px; line-height: 1.6; color: var(--ev-muted); }
.bts-also { display: grid; gap: 20px; margin-top: 32px; }
@media (min-width: 768px) { .bts-also { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
.bts-also__card {
  display: flex; flex-direction: column; padding: 26px; border-radius: 20px; background: #fff; border: 1px solid var(--ev-line);
  color: var(--ev-ink); text-decoration: none; transition: border-color .2s, box-shadow .2s, transform .2s;
}
.bts-also__card:hover { color: var(--ev-ink); border-color: rgba(0, 178, 107, .5); box-shadow: 0 24px 48px -32px rgba(0, 60, 36, .45); transform: translateY(-2px); }
.bts-also__card:focus-visible { outline: 3px solid var(--ev-green); outline-offset: 3px; }
.bts-also__card h3 { margin-bottom: 8px; }
.bts-also__card p { margin: 0 0 20px; line-height: 1.6; color: var(--ev-muted); }
.bts-also__link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; font-weight: 600; color: var(--ev-green-dark); }
.bts-also__link img { filter: invert(36%) sepia(93%) saturate(1300%) hue-rotate(130deg) brightness(88%); }

/* ---------------------------------------------------------------- */
/* Same refinements as /websummit-2026                                */
/* ---------------------------------------------------------------- */
/* hero trust row: a small grey mark before each credential */
.bts .dp-trust li { display: inline-flex; align-items: center; gap: 8px; }
.bts-logo { flex: none; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; }

/* "How it helps": number, icon and title on one line, preview centred */
.bts .dp-gets li { grid-template-columns: 28px minmax(0, 1fr); align-items: start; }
.bts .dp-gets__n { padding-top: 10px; line-height: 20px; }
.bts .dp-gets__body h3 { align-items: flex-start; line-height: 26px; padding-top: 7px; }
.bts .dp-gets__body h3 .ev-icon { flex: none; margin-top: -7px; margin-bottom: -7px; }
@media (min-width: 768px) {
  .bts .dp-gets li { grid-template-columns: 28px minmax(0, 1fr) 250px; }
  .bts .dp-gets .dp-mini { align-self: center; }
}

/* new-retailer preview: white rows with a store tile, name over area */
.bts-mini__rows { display: grid; gap: 8px; }
.bts-mini__rows p { display: flex; align-items: center; gap: 9px; margin: 0; padding: 7px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--ev-line); }
.bts-mini__ico { flex: none; position: relative; display: block; width: 30px; height: 30px; border-radius: 8px; background: #EEF4FF; }
.bts-mini__ico::after { content: ""; position: absolute; inset: 6px; background: #1D4ED8; -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; }
.bts-mini__what { display: grid; gap: 1px; min-width: 0; font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--ev-ink); white-space: nowrap; }
.bts-mini__what, .bts-mini__what small { overflow: hidden; text-overflow: ellipsis; }
.bts-mini__what small { font-size: 11px; font-weight: 500; color: var(--ev-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bts-mini__what small b { color: #1D4ED8; font-weight: 700; }

/* ---------------------------------------------------------------- */
/* Visiting BTS: when, where, passes (official organiser facts)       */
/* ---------------------------------------------------------------- */
.bts-visit { display: grid; gap: 16px; margin-top: 8px; }
@media (min-width: 900px) { .bts-visit { grid-template-columns: 1.3fr 1fr 1fr; gap: 20px; } }
.bts-visit__card { display: flex; flex-direction: column; gap: 12px; padding: 22px; border-radius: 18px; background: #fff; border: 1px solid var(--ev-line); }
.bts-visit__label { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ev-green-dark); }
.bts-visit__days { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.bts-visit__days li { display: grid; gap: 2px; padding-bottom: 12px; border-bottom: 1px solid var(--ev-line); }
.bts-visit__days li:last-child { padding-bottom: 0; border-bottom: 0; }
.bts-visit__days b { font-size: 15px; color: var(--ev-ink); }
.bts-visit__days span { font-size: 14px; color: var(--ev-ink); }
.bts-visit__days small { font-size: 12px; color: var(--ev-muted); }
.bts-visit__text { margin: 0; font-size: 14px; line-height: 1.6; color: var(--ev-muted); }
.bts-visit__text b { display: block; margin-bottom: 4px; font-size: 15px; color: var(--ev-ink); }
.bts-visit__card .dp-textlink { margin-top: auto; }
.bts-visit__cta { margin-top: 28px; }

/* 17 Nov needs a paid pass (organiser rules): one line under both day pickers */
.bts-dates__note { margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: var(--ev-muted); }