/* Taqdimot (showroom) — visual clone of paket.familymandarin.uz.
   Every rule below is copied/adapted from /opt/tour/paket/index.html and
   scoped under .o_tour_showroom so the backend look stays identical to the
   public landing. */

.o_tour_showroom {
    --fd: 'Montserrat', system-ui, sans-serif;
    --fb: 'Mulish', system-ui, sans-serif;
    --page: #ECE6DB;
    height: 100%;
    overflow: auto;
    background: var(--page);
    color: #2B2A28;
    font-family: var(--fb);
    padding: 28px 22px 40px;
    -webkit-font-smoothing: antialiased;
}
.o_tour_showroom .shw-wrap { max-width: 1180px; margin: 0 auto; }
.o_tour_showroom .shw-empty {
    text-align: center; padding: 60px 0; font-family: var(--fb);
    font-weight: 600; color: #7A6B57; font-size: 15px;
}

.o_tour_showroom .brand { text-align: center; margin-bottom: 26px; }
.o_tour_showroom .brand h1 {
    font-family: var(--fd); font-weight: 800; font-size: 30px;
    letter-spacing: .4px; color: #262320; text-transform: uppercase; margin: 0;
}
.o_tour_showroom .brand .u {
    width: 74px; height: 4px; background: #ED5A1B; border-radius: 3px;
    margin: 9px auto 7px;
}
.o_tour_showroom .brand p {
    font-family: var(--fb); font-weight: 600; color: #6B5F50;
    font-size: 14px; letter-spacing: .3px; margin: 0;
}

/* themes (same palette as the landing) */
.o_tour_showroom .t-gold    { --c1:#1E3157; --c1d:#0F1C34; --c2:#B89039; --c2d:#8A6A22; --ontitle:#E6D9B0; --onc2:#1A1508; --acc:#2C4E82; --bg:#F1F4F9; --panel:#FCFDFF; --line:#D9E1EE; --txt:#232B39; --txt2:#5C6675; }
.o_tour_showroom .t-emerald { --c1:#134D3C; --c1d:#0B3327; --c2:#C2A24E; --c2d:#917430; --ontitle:#EFE6CB; --onc2:#143A2E; --acc:#15604A; --bg:#F3F6F1; --panel:#FBFDFA; --line:#DBE7DD; --txt:#233028; --txt2:#566A5E; }
.o_tour_showroom .t-blue    { --c1:#1F6FA0; --c1d:#134B6E; --c2:#15506F; --c2d:#0E3A52; --ontitle:#FFFFFF; --onc2:#FFFFFF; --acc:#1C6695; --bg:#F1F6FA; --panel:#FBFDFF; --line:#D7E6F1; --txt:#233642; --txt2:#5A6E7C; }
.o_tour_showroom .t-teal    { --c1:#0F6E68; --c1d:#0A4A46; --c2:#0C5650; --c2d:#083E3A; --ontitle:#FFFFFF; --onc2:#FFFFFF; --acc:#0E625A; --bg:#EFF7F6; --panel:#FBFEFD; --line:#D3E8E5; --txt:#22332F; --txt2:#5A6E6A; }
.o_tour_showroom .t-tower   { --c1:#4A2E6B; --c1d:#331E4C; --c2:#B8862F; --c2d:#8A6420; --ontitle:#F2E7CF; --onc2:#241708; --acc:#5B3B7A; --bg:#F6F3FA; --panel:#FDFCFE; --line:#E5DCEE; --txt:#2C2338; --txt2:#665A78; }
.o_tour_showroom .t-tawhid  { --c1:#12100C; --c1d:#000000; --c2:#C9A24B; --c2d:#9A7A2E; --ontitle:#E8CF92; --onc2:#1A1206; --acc:#B08A38; --bg:#F7F3EA; --panel:#FFFDF8; --line:#EAE0CC; --txt:#2A2418; --txt2:#6E6144; }
.o_tour_showroom .t-swiss   { --c1:#8E2A2A; --c1d:#5E1A1A; --c2:#B89039; --c2d:#8A6A22; --ontitle:#F7E6CC; --onc2:#241410; --acc:#9B2E2E; --bg:#FBF4F2; --panel:#FFFCFB; --line:#ECD8D4; --txt:#2E211E; --txt2:#7C615B; }
.o_tour_showroom .t-shohada { --c1:#6A1E32; --c1d:#48121F; --c2:#B8862F; --c2d:#8A6420; --ontitle:#F4E1CC; --onc2:#241708; --acc:#7A2438; --bg:#FAF3F2; --panel:#FFFCFB; --line:#EAD9D6; --txt:#2E211F; --txt2:#736059; }
.o_tour_showroom .t-eba     { --c1:#7A4A1F; --c1d:#573414; --c2:#B8862F; --c2d:#8A6420; --ontitle:#F4E6C8; --onc2:#241708; --acc:#8A5A24; --bg:#F8F4EC; --panel:#FEFCF7; --line:#EBE0CC; --txt:#2E2417; --txt2:#6E6045; }

/* tiles (paket-oila ikonkalari) — 4 per row on a full-width screen */
.o_tour_showroom .tiles {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 24px;
    max-width: 1180px; margin: 6px auto 0;
    animation: shw-fade .34s ease;
}
.o_tour_showroom .tile {
    flex: 0 1 264px; aspect-ratio: 1/1; border: none; border-radius: 26px;
    cursor: pointer; display: flex; flex-direction: column; align-items: center;
    justify-content: center; gap: 10px; background: var(--c1);
    box-shadow: 0 14px 32px rgba(40,30,20,.20);
    transition: transform .2s, box-shadow .2s; padding: 20px;
}
.o_tour_showroom .tile:hover { transform: translateY(-6px); box-shadow: 0 22px 46px rgba(40,30,20,.30); }
.o_tour_showroom .tile .tname { font-family: var(--fd); font-weight: 800; font-size: 24px; letter-spacing: 1px; color: var(--ontitle); line-height: 1.15; }
.o_tour_showroom .tile .tsub { font-family: var(--fd); font-weight: 700; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--ontitle); opacity: .9; }
.o_tour_showroom .tile .tgo { margin-top: 6px; font-family: var(--fb); font-weight: 700; font-size: 13px; color: var(--onc2); background: var(--c2); padding: 7px 16px; border-radius: 999px; box-shadow: 0 2px 0 var(--c2d); }
/* Location pill on the family tile (landing .teyebrow) — the packet filial */
.o_tour_showroom .tile .teyebrow { font-family: var(--fd); font-weight: 700; font-size: 11px; letter-spacing: 3px; color: var(--ontitle); opacity: .78; background: rgba(255,255,255,.16); padding: 3px 13px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; text-transform: uppercase; }
.o_tour_showroom .tile .teyebrow svg { flex: none; width: 12px; height: 12px; }

/* topbar */
.o_tour_showroom .topbar { max-width: 1180px; margin: 0 auto 22px; display: flex; align-items: center; gap: 14px; }
.o_tour_showroom .back {
    background: #fff; border: 1px solid #E0D6C6; border-radius: 11px;
    padding: 9px 15px; cursor: pointer; font-family: var(--fb);
    font-weight: 700; font-size: 13.5px; color: #3A332B;
    display: inline-flex; align-items: center; gap: 7px; transition: background .15s;
}
.o_tour_showroom .back:hover { background: #F6F0E6; }
.o_tour_showroom .crumb { font-family: var(--fb); font-weight: 600; color: #7A6B57; font-size: 13.5px; }
.o_tour_showroom .crumb b { color: #2B2A28; }

/* cards */
.o_tour_showroom .cards { text-align: center; font-size: 0; animation: shw-fade .34s ease; }
.o_tour_showroom .col { display: inline-block; vertical-align: top; width: 360px; margin: 11px; font-size: 14px; }
.o_tour_showroom .col .card { width: 100%; }
.o_tour_showroom .card {
    background: var(--bg); color: var(--txt); border: none; border-radius: 22px;
    padding: 14px; box-shadow: 0 10px 26px rgba(40,30,20,.10);
    display: flex; flex-direction: column; gap: 9px; text-align: left;
}
.o_tour_showroom .title {
    background: var(--c1); color: var(--ontitle); border-radius: 13px;
    text-align: center; padding: 11px 8px; font-family: var(--fd);
    font-weight: 800; letter-spacing: .6px; font-size: 19px;
    text-transform: uppercase; box-shadow: 0 4px 0 var(--c1d);
}
.o_tour_showroom .shw-title-link { cursor: pointer; }
/* Location eyebrow above the card title (landing .t-eyebrow) */
.o_tour_showroom .title .t-eyebrow { display: flex; align-items: center; justify-content: center; gap: 5px; font-family: var(--fd); font-weight: 700; font-size: 9.5px; letter-spacing: 3px; opacity: .82; margin-bottom: 3px; }
.o_tour_showroom .title .t-eyebrow svg { flex: none; width: 11px; height: 11px; }
.o_tour_showroom .airline {
    background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
    padding: 9px 12px; display: flex; align-items: center; gap: 11px; justify-content: center;
}
.o_tour_showroom .airline svg { flex: none; }
.o_tour_showroom .airline .al-name { font-family: var(--fd); font-weight: 700; color: var(--acc); font-size: 14px; letter-spacing: .2px; text-transform: uppercase; }
.o_tour_showroom .airline .al-route { font-size: 11px; color: var(--txt2); font-weight: 600; line-height: 1.35; margin-top: 2px; }
.o_tour_showroom .date-strip { text-align: center; }
.o_tour_showroom .date-label { font-family: var(--fb); font-weight: 700; color: var(--acc); font-size: 11px; letter-spacing: 1.2px; text-transform: uppercase; display: flex; align-items: center; justify-content: center; gap: 6px; }
.o_tour_showroom .date-pills { display: flex; gap: 6px; justify-content: center; align-items: center; margin-top: 6px; }
.o_tour_showroom .date-pill { background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 6px 13px; font-family: var(--fd); font-weight: 700; color: var(--txt); font-size: 14px; }
.o_tour_showroom .date-dash { font-family: var(--fd); font-weight: 800; color: var(--acc); font-size: 22px; line-height: 1; letter-spacing: -1px; padding: 0 2px; }
.o_tour_showroom .days-badge {
    align-self: center; background: var(--c2); color: var(--onc2);
    border-radius: 999px; padding: 6px 20px; font-family: var(--fd);
    font-weight: 800; letter-spacing: .4px; font-size: 14.5px;
    display: flex; align-items: center; gap: 8px; box-shadow: 0 3px 0 var(--c2d);
}
.o_tour_showroom .hotel {
    background: var(--panel); border: 1px solid var(--line); border-radius: 13px;
    padding: 9px 11px; display: flex; align-items: flex-start; gap: 11px;
}
.o_tour_showroom .hotel .ic { flex: none; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.o_tour_showroom .hotel .h-body { flex: 1; min-width: 0; }
.o_tour_showroom .hotel .h-city { font-family: var(--fd); font-weight: 800; color: var(--acc); font-size: 15px; letter-spacing: .2px; text-transform: uppercase; line-height: 1.05; }
.o_tour_showroom .hotel .h-city b { color: var(--c2); font-size: 12.5px; font-weight: 800; }
.o_tour_showroom .hotel .h-name { font-family: var(--fb); font-weight: 700; color: var(--txt); font-size: 13.5px; margin-top: 3px; line-height: 1.2; }
.o_tour_showroom .hotel .h-meal { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-family: var(--fb); font-weight: 700; color: var(--txt2); font-size: 12px; line-height: 1; flex-wrap: wrap; row-gap: 3px; }
.o_tour_showroom .hotel .h-meal svg { flex: none; width: 15px; height: 15px; }
.o_tour_showroom .hotel .h-meal b { color: var(--acc); font-family: var(--fd); font-weight: 800; letter-spacing: .2px; }
.o_tour_showroom .hotel .h-meal .mtype { font-size: 11px; }
.o_tour_showroom .prices { display: flex; flex-direction: column; gap: 7px; margin-top: 1px; }
.o_tour_showroom .price-row {
    background: var(--panel); border: 1px solid var(--line); border-radius: 11px;
    padding: 5px 6px 5px 12px; display: flex; align-items: center;
    justify-content: space-between; gap: 8px;
}
.o_tour_showroom .price-row .pl { display: flex; align-items: center; gap: 10px; font-family: var(--fb); font-weight: 700; color: var(--txt); font-size: 12.5px; min-width: 0; }
.o_tour_showroom .price-row .pl svg { flex: none; }
.o_tour_showroom .price-row .pl span { line-height: 1.2; }
.o_tour_showroom .shw-price-link { cursor: pointer; transition: transform .12s, box-shadow .12s, border-color .12s; }
.o_tour_showroom .shw-price-link:hover { border-color: var(--c2); box-shadow: 0 3px 10px rgba(40,30,20,.12); transform: translateY(-1px); }
.o_tour_showroom .price-tag {
    background: var(--c2); color: var(--onc2); border-radius: 9px;
    padding: 6px 14px; font-family: var(--fd); font-weight: 800;
    font-size: 16.5px; letter-spacing: .2px; min-width: 90px;
    text-align: center; box-shadow: 0 2px 0 var(--c2d); white-space: nowrap;
}
.o_tour_showroom .train {
    background: var(--c1); color: var(--ontitle); border-radius: 11px;
    padding: 8px; text-align: center; font-family: var(--fd); font-weight: 800;
    letter-spacing: .3px; font-size: 13.5px; display: flex; align-items: center;
    justify-content: center; gap: 9px; text-transform: uppercase;
}
.o_tour_showroom .note { text-align: center; font-family: var(--fb); font-weight: 600; color: var(--txt2); font-size: 11.5px; letter-spacing: .2px; }
.o_tour_showroom .extra { background: var(--panel); border: 1px dashed var(--c2); border-radius: 11px; padding: 8px 10px; display: flex; align-items: center; gap: 10px; }
.o_tour_showroom .extra svg { flex: none; }
.o_tour_showroom .extra span { font-family: var(--fb); font-weight: 800; color: var(--acc); font-size: 11.5px; line-height: 1.3; letter-spacing: .1px; text-transform: uppercase; }
.o_tour_showroom .inc-head { text-align: center; font-family: var(--fb); font-weight: 800; color: var(--acc); font-size: 11.5px; letter-spacing: .3px; text-transform: uppercase; margin-top: 2px; }
.o_tour_showroom .inc-grid { text-align: center; font-size: 0; padding: 3px 0 0; }
.o_tour_showroom .inc { display: inline-block; vertical-align: top; width: 25%; box-sizing: border-box; padding: 0 3px; margin-top: 9px; text-align: center; }
.o_tour_showroom .inc .ib { width: 28px; height: 28px; border-radius: 8px; background: var(--panel); border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; margin: 0 auto 4px; }
.o_tour_showroom .inc .inc-emoji { font-size: 14px; line-height: 1; }
.o_tour_showroom .inc small { display: block; font-family: var(--fb); font-weight: 600; color: var(--txt2); font-size: 8.8px; line-height: 1.18; }

.o_tour_showroom .dl-btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: calc(100% - 2px); margin: 11px auto 0; background: var(--c1);
    color: var(--ontitle); border: none; border-radius: 13px; padding: 13px;
    font-family: var(--fd); font-weight: 800; font-size: 14px;
    letter-spacing: .4px; cursor: pointer; box-shadow: 0 3px 0 var(--c1d);
    transition: transform .15s;
}
.o_tour_showroom .dl-btn:hover { transform: translateY(-2px); }
.o_tour_showroom .dl-btn:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--c1d); }
.o_tour_showroom .dl-btn:disabled { opacity: .6; cursor: wait; }
.o_tour_showroom .dl-btn svg { flex: none; }

/* backend-only helper line (outside .card, never in the downloaded PNG) */
.o_tour_showroom .member-note {
    text-align: center; margin-top: 7px; font-family: var(--fb);
    font-weight: 700; color: #7A6B57; font-size: 12px; letter-spacing: .2px;
}

@keyframes shw-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

@media (max-width: 820px) {
    .o_tour_showroom .col { width: 100%; max-width: 380px; margin: 9px auto; display: block; }
    .o_tour_showroom .cards { font-size: 14px; }
    .o_tour_showroom .tiles { max-width: 420px; }
    .o_tour_showroom .tile { flex: 1 1 100%; aspect-ratio: auto; min-height: 170px; }
}