/*
 * FILE: cairo.css
 * PURPOSE: Cairo digital tobacconist interface
 * CREDIT: Designed & Developed by The Taino Resource Group LLC
 */

:root{
    --cairo-gold:#c7922f;
    --cairo-ink:#17130f;
    --cairo-panel:#f7f2e8;
    --cairo-copy:#2d251e;
    --cairo-muted:#6d6055;
    --cairo-border:rgba(77,60,43,.16);
}

body.cairo-open{overflow:hidden}
.cairo-shell[hidden]{display:none!important}

.cairo-shell{
    position:fixed;
    inset:0;
    z-index:9998;
    display:flex;
    justify-content:flex-end;
    align-items:stretch;
}

.cairo-backdrop{
    position:absolute;
    inset:0;
    border:0;
    background:rgba(10,8,6,.72);
    backdrop-filter:blur(5px);
    cursor:pointer;
}

.cairo-panel{
    position:relative;
    z-index:1;
    width:min(100%,472px);
    height:100%;
    display:flex;
    flex-direction:column;
    background:var(--cairo-panel);
    color:var(--cairo-copy);
    box-shadow:-24px 0 70px rgba(0,0,0,.30);
    overflow:hidden;
    animation:cairo-enter .28s ease-out both;
    outline:none;
}

@keyframes cairo-enter{
    from{transform:translateX(28px);opacity:.25}
    to{transform:translateX(0);opacity:1}
}

.cairo-panel__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:1.15rem 1.25rem;
    border-bottom:1px solid var(--cairo-border);
    background:#fbf5e9;
}

.cairo-identity{
    display:flex;
    align-items:center;
    gap:.9rem;
}

.cairo-identity__avatar{
    width:70px;
    height:70px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid rgba(199,146,47,.48);
    box-shadow:0 5px 16px rgba(0,0,0,.10);
}

.cairo-identity__eyebrow{
    display:block;
    margin-bottom:.18rem;
    color:#8b641c;
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.cairo-identity__name{
    margin:0;
    color:#2a2018;
    font-size:1.72rem;
    line-height:1;
}

.cairo-identity__brand{
    display:block;
    margin-top:.28rem;
    color:#7b6c5e;
    font-size:.72rem;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.cairo-close{
    width:42px;
    height:42px;
    flex:0 0 42px;
    border:1px solid var(--cairo-border);
    border-radius:50%;
    background:#fffaf2;
    color:#332a22;
    font-size:1.65rem;
    line-height:1;
    cursor:pointer;
}

.cairo-panel__body{
    flex:1;
    overflow-y:auto;
    padding:1.4rem 1.25rem 2rem;
}

.cairo-message{
    display:flex;
    align-items:flex-start;
    gap:.7rem;
}

.cairo-message>img{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:50%;
    object-fit:cover;
    border:1px solid rgba(199,146,47,.35);
}

.cairo-message>div{
    min-width:0;
}

.cairo-message strong{
    display:block;
    margin-bottom:.2rem;
    color:#473929;
    font-size:.78rem;
}

.cairo-message p{
    margin:.35rem 0;
    line-height:1.67;
}

.cairo-message--cairo>div{
    padding:.8rem .9rem;
    border:1px solid rgba(77,60,43,.12);
    border-radius:4px 14px 14px 14px;
    background:#fffaf2;
}

.cairo-message--answer>div{
    width:100%;
}

.cairo-prompt{
    margin:1.25rem 0 .8rem;
    color:var(--cairo-muted);
    font-weight:800;
}

.cairo-options{
    display:grid;
    gap:.68rem;
}

.cairo-option{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:1rem 1.05rem;
    border:1px solid var(--cairo-border);
    border-radius:13px;
    background:#fffaf3;
    color:var(--cairo-copy);
    text-align:left;
    font:inherit;
    font-weight:700;
    cursor:pointer;
    transition:transform .16s ease,border-color .16s ease,background .16s ease;
}

.cairo-option:hover,
.cairo-option:focus-visible{
    transform:translateY(-1px);
    border-color:rgba(199,146,47,.58);
    background:#fff;
}

.cairo-option--primary{
    background:var(--cairo-ink);
    color:#fff7ea;
    border-color:var(--cairo-ink);
}

.cairo-back{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    margin:0 0 1.1rem;
    padding:.5rem 0;
    border:0;
    background:none;
    color:#765e25;
    font:inherit;
    font-weight:800;
    cursor:pointer;
}

.cairo-answer__label{
    display:block;
    margin:.1rem 0 .42rem;
    color:#8b641c;
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.cairo-answer h3{
    margin:0 0 .8rem;
    color:#2b2119;
    font-size:1.52rem;
    line-height:1.2;
}

.cairo-answer p,
.cairo-answer li{
    line-height:1.65;
}

.cairo-answer ul{
    margin:.7rem 0;
    padding-left:1.25rem;
}

.cairo-note{
    margin-top:1rem!important;
    padding:.9rem 1rem;
    border-left:3px solid var(--cairo-gold);
    background:#f8efdf;
    font-size:.9rem;
}

.cairo-followups{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
    margin:1rem 0 0 3rem;
}

.cairo-followups>span{
    flex-basis:100%;
    color:var(--cairo-muted);
    font-size:.76rem;
    font-weight:800;
}

.cairo-followups button{
    border:1px solid rgba(199,146,47,.36);
    border-radius:999px;
    background:#fffaf2;
    color:#5d491d;
    padding:.48rem .72rem;
    font:inherit;
    font-size:.78rem;
    font-weight:700;
    cursor:pointer;
}

.cairo-contact-cta{
    display:inline-flex;
    margin-top:.85rem;
}

.cairo-panel__footer{
    padding:.85rem 1.25rem;
    border-top:1px solid var(--cairo-border);
    color:var(--cairo-muted);
    background:#fbf5e9;
    font-size:.78rem;
}

.cairo-launcher{
    position:fixed;
    right:1.25rem;
    bottom:1.25rem;
    z-index:9990;
    display:flex;
    align-items:center;
    gap:.7rem;
    padding:.45rem .9rem .45rem .45rem;
    border:1px solid rgba(199,146,47,.55);
    border-radius:999px;
    background:#17130f;
    color:#fff;
    box-shadow:0 14px 40px rgba(0,0,0,.28);
    cursor:pointer;
}

.cairo-launcher img{
    width:54px;
    height:54px;
    border-radius:50%;
    object-fit:cover;
}

.cairo-launcher__copy{
    display:grid;
    gap:.05rem;
    text-align:left;
    line-height:1.1;
}

.cairo-launcher__copy strong{font-size:.96rem}
.cairo-launcher__copy span{
    color:#dfcda9;
    font-size:.72rem;
}

@media (max-width:640px){
    .cairo-panel{width:100%}
    .cairo-panel__header{padding:1rem}
    .cairo-panel__body{padding:1.15rem 1rem 1.5rem}
    .cairo-identity__avatar{width:62px;height:62px}
    .cairo-launcher{right:.8rem;bottom:.8rem;padding:.35rem}
    .cairo-launcher img{width:52px;height:52px}
    .cairo-launcher__copy{display:none}
    .cairo-followups{margin-left:0}
}

@media (prefers-reduced-motion:reduce){
    .cairo-panel{animation:none}
    .cairo-option{transition:none}
}


/* Cairo thinking and typing states */
.cairo-thinking{
    display:flex;
    align-items:flex-start;
    gap:.7rem;
    margin-top:.15rem;
}

.cairo-thinking>img{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:50%;
    object-fit:cover;
    border:1px solid rgba(199,146,47,.35);
}

.cairo-thinking__bubble{
    min-width:72px;
    padding:.82rem .95rem;
    border:1px solid rgba(77,60,43,.12);
    border-radius:4px 14px 14px 14px;
    background:#fffaf2;
}

.cairo-thinking__dots{
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    height:16px;
}

.cairo-thinking__dots span{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#8b641c;
    opacity:.35;
    animation:cairo-thinking-dot 1.05s infinite ease-in-out;
}

.cairo-thinking__dots span:nth-child(2){
    animation-delay:.14s;
}

.cairo-thinking__dots span:nth-child(3){
    animation-delay:.28s;
}

@keyframes cairo-thinking-dot{
    0%,60%,100%{
        transform:translateY(0);
        opacity:.30;
    }
    30%{
        transform:translateY(-4px);
        opacity:1;
    }
}

.cairo-answer{
    opacity:0;
}

.cairo-answer--visible{
    opacity:1;
}

.cairo-answer--typing .cairo-message--answer>div::after{
    content:"";
    display:inline-block;
    width:2px;
    height:1em;
    margin-left:3px;
    vertical-align:-.12em;
    background:#8b641c;
    animation:cairo-cursor .72s steps(1,end) infinite;
}

@keyframes cairo-cursor{
    0%,48%{opacity:1}
    49%,100%{opacity:0}
}

.cairo-sr-only{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}

@media (prefers-reduced-motion:reduce){
    .cairo-thinking__dots span,
    .cairo-answer--typing .cairo-message--answer>div::after{
        animation:none;
    }
}


/* Cairo v2 deeper knowledge navigation */
.cairo-followups{
    padding-bottom:.25rem;
}

.cairo-followups button{
    line-height:1.25;
}

.cairo-answer h3{
    max-width:18ch;
}

@media (min-width:641px){
    .cairo-panel__body{
        scrollbar-gutter:stable;
    }
}


/* Cairo v2.1 — contextual JL page references */
.cairo-context-intro{
    margin:.15rem 0 .9rem!important;
    color:#3b3026;
    font-size:1rem;
    line-height:1.68;
}

.cairo-source-links{
    display:grid;
    gap:.5rem;
    margin:.45rem 0 1rem;
}

.cairo-source-link{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.8rem;
    padding:.72rem .85rem;
    border:1px solid rgba(199,146,47,.34);
    border-radius:10px;
    background:#f8edd9;
    color:#5f4719;
    font-size:.82rem;
    font-weight:800;
    line-height:1.35;
    text-decoration:none;
}

.cairo-source-link:hover,
.cairo-source-link:focus-visible{
    border-color:rgba(199,146,47,.72);
    background:#fff4df;
}

.cairo-closing-prompt{
    margin-top:1rem!important;
    color:#54473c;
    font-style:italic;
}


/* Cairo v2.2 — JL site context routing */
.cairo-source-link[href*="/about"],
.cairo-source-link[href*="/lounge"],
.cairo-source-link[href*="/events"],
.cairo-source-link[href*="/corporate-events"],
.cairo-source-link[href*="/personalized-cigars"]{
    position:relative;
}

.cairo-source-link[href*="/about"]::before,
.cairo-source-link[href*="/lounge"]::before,
.cairo-source-link[href*="/events"]::before,
.cairo-source-link[href*="/corporate-events"]::before,
.cairo-source-link[href*="/personalized-cigars"]::before{
    content:"JL";
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:26px;
    height:26px;
    margin-right:.15rem;
    border-radius:50%;
    background:#17130f;
    color:#e5c276;
    font-size:.61rem;
    font-weight:900;
    letter-spacing:.08em;
}


/* Cairo v2.4 — guided inquiry and lead capture */
.cairo-inquiry-cta{
    width:100%;
    margin-top:1rem;
    min-height:48px;
    cursor:pointer;
}

.cairo-contact-fallback{
    display:inline-block;
    margin-top:.8rem;
    color:var(--cairo-muted);
    font-size:.8rem;
    text-decoration:underline;
    text-underline-offset:3px;
}

.cairo-inquiry__intro{
    margin-bottom:1rem;
}

.cairo-inquiry-form{
    display:grid;
    gap:1rem;
}

.cairo-inquiry-step{
    display:grid;
    gap:1rem;
}

.cairo-field{
    display:grid;
    gap:.42rem;
}

.cairo-field>span,
.cairo-fieldset legend{
    color:#463a30;
    font-size:.8rem;
    font-weight:800;
    letter-spacing:.025em;
}

.cairo-field input,
.cairo-field textarea{
    width:100%;
    min-height:48px;
    border:1px solid rgba(77,60,43,.24);
    border-radius:10px;
    background:#fffdf8;
    color:var(--cairo-copy);
    font:inherit;
    padding:.78rem .85rem;
    outline:none;
}

.cairo-field textarea{
    min-height:128px;
    resize:vertical;
    line-height:1.5;
}

.cairo-field input:focus,
.cairo-field textarea:focus{
    border-color:rgba(199,146,47,.88);
    box-shadow:0 0 0 3px rgba(199,146,47,.12);
}

.cairo-field--error input,
.cairo-field--error textarea,
input[aria-invalid="true"]{
    border-color:#a23e32!important;
}

.cairo-fieldset{
    display:grid;
    gap:.7rem;
    margin:0;
    padding:0;
    border:0;
}

.cairo-fieldset>label{
    display:flex;
    align-items:flex-start;
    gap:.55rem;
    color:#51453a;
    font-size:.86rem;
    line-height:1.45;
}

.cairo-fieldset input[type="checkbox"]{
    width:18px;
    height:18px;
    margin-top:.08rem;
    accent-color:var(--cairo-gold);
}

.cairo-choice-grid{
    display:grid;
    gap:.55rem;
}

.cairo-choice-grid button,
.cairo-inquiry-next,
.cairo-inquiry-submit,
.cairo-inquiry-edit,
.cairo-inquiry-finish,
.cairo-whatsapp-handoff{
    min-height:48px;
    border-radius:10px;
    font:inherit;
    cursor:pointer;
}

.cairo-choice-grid button{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:100%;
    border:1px solid rgba(77,60,43,.18);
    background:#fffaf2;
    color:#3d332a;
    padding:.72rem .8rem;
    font-weight:750;
    text-align:left;
}

.cairo-choice-grid button:hover,
.cairo-choice-grid button:focus-visible,
.cairo-choice-grid button.is-selected{
    border-color:rgba(199,146,47,.72);
    background:#f7ecd6;
}

.cairo-choice-grid button.is-selected::before{
    content:"✓";
    margin-right:.55rem;
    color:#785516;
    font-weight:900;
}

.cairo-choice-grid--compact{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.cairo-inquiry-next,
.cairo-inquiry-submit,
.cairo-inquiry-finish{
    width:100%;
    border:1px solid var(--cairo-ink);
    background:var(--cairo-ink);
    color:#fff8e8;
    padding:.78rem 1rem;
    font-weight:850;
}

.cairo-inquiry-submit[disabled]{
    cursor:wait;
    opacity:.65;
}

.cairo-inquiry-edit{
    width:100%;
    border:1px solid var(--cairo-border);
    background:transparent;
    color:var(--cairo-copy);
    padding:.72rem 1rem;
    font-weight:750;
}

.cairo-inquiry-summary{
    display:grid;
    grid-template-columns:minmax(100px,.8fr) minmax(0,1.4fr);
    margin:0;
    overflow:hidden;
    border:1px solid rgba(77,60,43,.14);
    border-radius:12px;
    background:#fffaf2;
}

.cairo-inquiry-summary dt,
.cairo-inquiry-summary dd{
    margin:0;
    padding:.6rem .7rem;
    border-bottom:1px solid rgba(77,60,43,.10);
    font-size:.8rem;
    line-height:1.4;
}

.cairo-inquiry-summary dt{
    color:#6a5a4d;
    font-weight:800;
}

.cairo-inquiry-summary dd{
    color:#332a23;
    overflow-wrap:anywhere;
}

.cairo-inquiry-summary dt:nth-last-of-type(1),
.cairo-inquiry-summary dd:nth-last-of-type(1){
    border-bottom:0;
}

.cairo-consent{
    display:flex;
    align-items:flex-start;
    gap:.6rem;
    color:#55483e;
    font-size:.78rem;
    line-height:1.5;
}

.cairo-consent input{
    width:18px;
    height:18px;
    flex:0 0 18px;
    margin-top:.08rem;
    accent-color:var(--cairo-gold);
}

.cairo-consent a{
    color:#6f4d10;
    font-weight:800;
}

.cairo-form-status{
    min-height:1.2rem;
    margin:0!important;
    color:#8b2f27!important;
    font-size:.8rem!important;
}

.cairo-field-error{
    min-height:1px;
    margin:0;
    font-size:.75rem;
    color:#8b2f27;
}

.cairo-honeypot{
    position:absolute!important;
    left:-10000px!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
}

.cairo-inquiry-success{
    padding-top:.4rem;
}

.cairo-inquiry-success h3{
    margin:.28rem 0 .55rem;
    font-family:var(--font-serif, Georgia, serif);
    font-size:1.28rem;
    line-height:1.2;
}

.cairo-whatsapp-handoff{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    border:1px solid rgba(77,60,43,.18);
    background:#fffaf2;
    color:#3b3026;
    padding:.76rem 1rem;
    font-weight:850;
    text-align:center;
    text-decoration:none;
}

@media (max-width:480px){
    .cairo-choice-grid--compact{
        grid-template-columns:1fr;
    }

    .cairo-inquiry-summary{
        grid-template-columns:1fr;
    }

    .cairo-inquiry-summary dt{
        padding-bottom:.2rem;
        border-bottom:0;
    }

    .cairo-inquiry-summary dd{
        padding-top:.2rem;
    }
}


/* Cairo v2.4.1 — authoritative hidden-state behavior */
.cairo-inquiry-step[hidden],
.cairo-inquiry-success[hidden],
.cairo-whatsapp-handoff[hidden]{
    display:none!important;
}


/* Cairo v2.5 — inquiry mode and WhatsApp handoff */
[data-cairo-wedding-block][hidden],
[data-cairo-corporate-block][hidden],
.cairo-whatsapp-status[hidden]{
    display:none!important;
}

.cairo-whatsapp-status{
    margin:.75rem 0;
    color:#5f4719;
    font-size:.86rem;
    font-weight:700;
}
