
.ija-services{
    --ija-services-primary:#0a798a;
    --ija-services-primary-dark:#075d69;
    --ija-services-ink:#17373d;
    --ija-services-muted:#61767b;
    --ija-services-line:#dce9eb;
    --ija-services-soft:#eef8f9;
    --ija-services-warm:#fcf8f5;
    --ija-services-shadow:0 28px 90px rgba(9,42,48,.26);
    position:relative;
    z-index:1000001;
}
.ija-services[hidden]{display:none!important}
.ija-services *{box-sizing:border-box}
.ija-services-gateway[hidden],
.ija-services-voice[hidden]{display:none!important}
.ija-services-gateway,
.ija-services-voice{
    position:fixed;
    inset:0;
    z-index:1000001;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
}
.ija-services-backdrop{
    position:absolute;
    inset:0;
    background:rgba(8,30,35,.62);
    backdrop-filter:blur(5px);
}
.ija-services-gateway-card,
.ija-services-voice-card{
    position:relative;
    width:min(900px,96vw);
    max-height:92vh;
    overflow:auto;
    border:1px solid rgba(10,121,138,.16);
    border-radius:24px;
    background:#fff;
    color:var(--ija-services-ink);
    box-shadow:var(--ija-services-shadow);
}
.ija-services-gateway-card{padding:38px}
.ija-services-brand{
    color:var(--ija-services-primary);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.ija-services-gateway-card h2,
.ija-services-voice-card h2{
    margin:7px 0 10px;
    color:var(--ija-services-ink);
    line-height:1.08;
}
.ija-services-gateway-card h2{font-size:clamp(29px,4.2vw,44px)}
.ija-services-lead{
    max-width:680px;
    margin:0 0 26px;
    color:var(--ija-services-muted);
    font-size:17px;
    line-height:1.55;
}
.ija-services-close{
    position:absolute;
    top:14px;
    right:14px;
    z-index:2;
    width:40px;
    height:40px;
    padding:0;
    border:0;
    border-radius:50%;
    background:#fff;
    color:var(--ija-services-ink);
    font-size:28px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 3px 14px rgba(10,50,56,.13);
}
.ija-services-language-wrap{
    display:flex;
    align-items:center;
    gap:14px;
    max-width:420px;
    margin-bottom:24px;
}
.ija-services-language-wrap label{font-weight:800}
.ija-services-language-wrap select{
    flex:1;
    min-height:44px;
    border:1px solid #cbdcdf;
    border-radius:10px;
    padding:0 12px;
    background:#fff;
    color:var(--ija-services-ink);
    font:inherit;
}
.ija-services-mode-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.ija-services-mode-card{
    display:grid;
    grid-template-columns:58px 1fr;
    grid-template-rows:auto auto;
    column-gap:15px;
    row-gap:4px;
    min-height:145px;
    padding:22px;
    border:1px solid var(--ija-services-line);
    border-radius:18px;
    background:#fff;
    color:var(--ija-services-ink);
    text-align:left;
    cursor:pointer;
    transition:transform .17s ease,border-color .17s ease,box-shadow .17s ease;
}
.ija-services-mode-card:hover{
    transform:translateY(-2px);
    border-color:rgba(10,121,138,.55);
    box-shadow:0 14px 34px rgba(10,82,91,.10);
}
.ija-services-mode-card.is-voice{background:var(--ija-services-warm)}
.ija-services-mode-card strong{
    align-self:end;
    font-size:18px;
    line-height:1.2;
}
.ija-services-mode-card>span:last-child{
    align-self:start;
    color:var(--ija-services-muted);
    font-size:13px;
    line-height:1.45;
}
.ija-services-mode-icon{
    grid-row:1/3;
    display:grid;
    place-items:center;
    width:56px;
    height:56px;
    border-radius:16px;
    background:var(--ija-services-primary);
    color:#fff;
}
.ija-services-mode-card.is-search .ija-services-mode-icon{
    background:#fff;
    color:var(--ija-services-primary);
    border:1px solid var(--ija-services-line);
}
.ija-services-mode-icon svg{width:26px;height:26px;fill:currentColor}

.ija-services-snooze{
    display:flex;
    align-items:center;
    gap:10px;
    margin:20px 0 4px;
    color:var(--ija-services-muted);
    font-size:14px;
    line-height:1.4;
    cursor:pointer;
    user-select:none;
}
.ija-services-snooze input{
    width:18px;
    height:18px;
    margin:0;
    flex:0 0 18px;
    accent-color:var(--ija-services-primary);
    cursor:pointer;
}
.ija-services-snooze:hover span{color:var(--ija-services-ink)}
.ija-services-note{
    margin:20px 0 0;
    color:#74868a;
    font-size:12px;
    line-height:1.45;
}

/* Voice experience */
.ija-services-voice-card{
    display:flex;
    flex-direction:column;
    width:min(940px,97vw);
    height:min(820px,94vh);
    overflow:hidden;
}
.ija-services-voice-header{
    position:relative;
    flex:0 0 auto;
    padding:20px 66px 17px 22px;
    border-bottom:1px solid var(--ija-services-line);
    background:var(--ija-services-warm);
}
.ija-services-voice-header h2{font-size:23px}
.ija-services-voice-stage{
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:22px 18px 17px;
    background:#fff;
}
.ija-services-orb{
    position:relative;
    display:grid;
    place-items:center;
    width:78px;
    height:78px;
    padding:0;
    border:0;
    border-radius:50%;
    background:linear-gradient(145deg,var(--ija-services-primary),#3295a3);
    color:#fff;
    cursor:pointer;
    box-shadow:0 12px 30px rgba(10,121,138,.25);
}
.ija-services-orb svg{position:relative;z-index:2;width:31px;height:31px;fill:currentColor}
.ija-services-rings,
.ija-services-rings::before,
.ija-services-rings::after{
    position:absolute;
    inset:0;
    content:"";
    border:1px solid rgba(10,121,138,.25);
    border-radius:50%;
    opacity:0;
}
.ija-services-rings::before{inset:-10px}
.ija-services-rings::after{inset:-20px}
.ija-services.is-connected .ija-services-rings,
.ija-services.is-connected .ija-services-rings::before,
.ija-services.is-connected .ija-services-rings::after{
    opacity:1;
    animation:ija-services-ring 1.8s infinite;
}
.ija-services.is-connected .ija-services-rings::before{animation-delay:.25s}
.ija-services.is-connected .ija-services-rings::after{animation-delay:.5s}
.ija-services.is-speaking .ija-services-orb{
    background:linear-gradient(145deg,#d16e4d,#e99b62);
    animation:ija-services-speak .8s ease-in-out infinite alternate;
}
.ija-services.is-listening .ija-services-orb{
    background:linear-gradient(145deg,#0a798a,#42a7b5);
    box-shadow:0 0 0 9px rgba(10,121,138,.09),0 14px 34px rgba(10,121,138,.28);
}
@keyframes ija-services-ring{
    0%{transform:scale(.84);opacity:.55}
    80%,100%{transform:scale(1.34);opacity:0}
}
@keyframes ija-services-speak{
    from{transform:scale(.96)}
    to{transform:scale(1.06)}
}
.ija-services-status{
    margin-top:15px;
    color:var(--ija-services-muted);
    font-size:13px;
    font-weight:700;
    text-align:center;
}
.ija-services-language-current{
    margin-top:3px;
    color:#85969a;
    font-size:11px;
}
.ija-services-transcript{
    flex:1 1 auto;
    min-height:140px;
    overflow:auto;
    padding:16px 20px;
    background:#f8faf9;
    border-top:1px solid #edf2f2;
}
.ija-services-message{
    display:flex;
    margin:0 0 11px;
}
.ija-services-message.is-user{justify-content:flex-end}
.ija-services-bubble{
    max-width:min(680px,88%);
    padding:10px 13px;
    border:1px solid var(--ija-services-line);
    border-radius:6px 15px 15px 15px;
    background:#fff;
    color:var(--ija-services-ink);
    line-height:1.48;
    font-size:13px;
}
.ija-services-message.is-user .ija-services-bubble{
    border-color:var(--ija-services-primary);
    border-radius:15px 6px 15px 15px;
    background:var(--ija-services-primary);
    color:#fff;
}
.ija-services-results{
    flex:0 0 auto;
    max-height:260px;
    overflow:auto;
    padding:12px 18px 17px;
    border-top:1px solid var(--ija-services-line);
    background:#fff;
}
.ija-services-results[hidden]{display:none!important}
.ija-services-results-heading{
    margin:0 0 9px;
    color:var(--ija-services-muted);
    font-size:11px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.ija-services-result-grid{display:grid;gap:9px}
.ija-services-result{
    display:grid;
    grid-template-columns:1fr auto;
    gap:9px 14px;
    padding:13px 14px;
    border:1px solid var(--ija-services-line);
    border-radius:13px;
    background:#fff;
}
.ija-services-result-type{
    color:var(--ija-services-primary);
    font-size:10px;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
}
.ija-services-result h3{margin:2px 0 3px;font-size:16px;line-height:1.2}
.ija-services-result-place{color:var(--ija-services-muted);font-size:12px}
.ija-services-result-meta{grid-column:1/-1;color:#60777b;font-size:11px}
.ija-services-result-actions{
    grid-column:1/-1;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.ija-services-result-actions a{
    display:inline-flex;
    align-items:center;
    min-height:31px;
    padding:0 10px;
    border:1px solid var(--ija-services-line);
    border-radius:8px;
    background:#fff;
    color:var(--ija-services-primary)!important;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
}
.ija-services-result-actions a.is-primary{
    border-color:var(--ija-services-primary);
    background:var(--ija-services-primary);
    color:#fff!important;
}
.ija-services-result-actions a.is-whatsapp{
    border-color:#25D366;
    background:#25D366;
    color:#fff!important;
}
.ija-services-voice-footer{
    flex:0 0 auto;
    display:flex;
    justify-content:space-between;
    gap:10px;
    padding:13px 18px;
    border-top:1px solid var(--ija-services-line);
    background:#fff;
}
.ija-services-secondary,
.ija-services-stop{
    min-height:39px;
    padding:0 14px;
    border-radius:9px;
    font:inherit;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
}
.ija-services-secondary{
    border:1px solid var(--ija-services-line);
    background:#fff;
    color:var(--ija-services-primary);
}
.ija-services-stop{
    border:1px solid var(--ija-services-primary);
    background:var(--ija-services-primary);
    color:#fff;
}
html.ija-services-lock{overflow:hidden}

/* Arabic UI */
.ija-services[dir="rtl"] .ija-services-gateway-card,
.ija-services[dir="rtl"] .ija-services-voice-card{text-align:right}
.ija-services[dir="rtl"] .ija-services-close{right:auto;left:14px}
.ija-services[dir="rtl"] .ija-services-voice-header{padding:20px 22px 17px 66px}
.ija-services[dir="rtl"] .ija-services-mode-card{text-align:right}

@media(max-width:680px){
    .ija-services-gateway,.ija-services-voice{padding:8px}
    .ija-services-gateway-card{padding:28px 18px 20px;border-radius:18px}
    .ija-services-mode-grid{grid-template-columns:1fr}
    .ija-services-mode-card{min-height:120px}
    .ija-services-language-wrap{align-items:stretch;flex-direction:column;gap:7px}
    .ija-services-voice-card{width:100%;height:95vh;border-radius:17px}
    .ija-services-voice-stage{padding:17px 12px 13px}
    .ija-services-orb{width:66px;height:66px}
    .ija-services-transcript{padding:13px 12px}
    .ija-services-results{padding:10px 11px 13px}
    .ija-services-voice-footer{flex-direction:column-reverse;padding:10px 11px}
    .ija-services-secondary,.ija-services-stop{width:100%}
}

/* Hybrid voice + text composer */
.ija-services-composer{
    flex:0 0 auto;
    display:flex;
    align-items:flex-end;
    gap:8px;
    padding:10px 18px;
    border-top:1px solid var(--ija-services-line);
    background:#fff;
}
.ija-services-composer textarea{
    flex:1 1 auto;
    min-width:0;
    min-height:42px;
    max-height:112px;
    resize:vertical;
    padding:10px 12px;
    border:1px solid var(--ija-services-line);
    border-radius:10px;
    background:#fff;
    color:var(--ija-services-ink);
    font:inherit;
    font-size:13px;
    line-height:1.4;
    outline:0;
}
.ija-services-composer textarea:focus{
    border-color:var(--ija-services-primary);
    box-shadow:0 0 0 3px rgba(10,121,138,.10);
}
.ija-services-send{
    flex:0 0 42px;
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    padding:0;
    border:1px solid var(--ija-services-primary);
    border-radius:10px;
    background:var(--ija-services-primary);
    color:#fff;
    cursor:pointer;
}
.ija-services-send svg{width:20px;height:20px;fill:currentColor}
.ija-services-send:disabled{opacity:.4;cursor:default}
.ija-services[dir="rtl"] .ija-services-composer textarea{text-align:right}

@media(max-width:680px){
    .ija-services-composer{padding:9px 11px}
    .ija-services-composer textarea{font-size:16px;resize:none}
}
