#ai-assistant { border:1px solid #eee; padding:12px; border-radius:12px; }
#ai-assistant .chat-box { height:220px; overflow:auto; padding:8px; background:#fafafa; border-radius:8px; margin-bottom:8px; }
#ai-assistant .chat-input { display:flex; gap:8px; }
#ai-assistant .chat-input input { flex:1; padding:8px; }
#ai-assistant .size-form { margin-top:14px; display:grid; gap:8px; }
#ai-assistant .size-form label { display:block; }
#ai-assistant button { padding:8px 12px; cursor:pointer; }


.ai-modal[hidden], .ai-overlay[hidden] { display: none !important; }

/* FAB */
.ai-fab{
    position: fixed;
    right: 6px;
    bottom: 142px;
    z-index: 1000;
    width: 30px;
    height: 54px;
    border-radius: 100%;
    background: #000;
    color: #fff;
    border: none;
    font-size: 19px;
    cursor: pointer;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ai-fab:hover{ transform:translateY(-1px); }

/* Overlay & Modal */
.ai-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:999;
    backdrop-filter:saturate(140%) blur(2px);
}
.ai-modal{
    position:fixed; right:16px; bottom:80px; z-index:1001;
    width:min(92vw, 420px); max-height:80vh; display:flex; flex-direction:column;
    background:#fff; border-radius:16px; box-shadow:0 10px 34px rgba(0,0,0,.28); overflow:hidden;
}
.ai-modal-header{
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 14px; border-bottom:1px solid #eee;
}
.ai-close{ background:transparent; border:none; font-size:24px; line-height:1; cursor:pointer; color: #000}

.ai-tabs{ display:flex; gap:6px; padding:10px 10px 0; }
.ai-tab{
    flex:1; padding:8px 10px; border:none; background:#f4f4f5; cursor:pointer;
    border-radius:10px; font-weight:600; color: #000;
}
.ai-tab-active{ background:#111; color:#fff; }

.ai-tabpanel{ padding:12px; overflow:auto; }

.chat-box{
    height:260px; background:#f8f8f8; border-radius:12px; padding:10px;
    overflow:auto; font-size:14px;
}
.chat-input{ display:flex; gap:8px; margin-top:10px; }
.chat-input input{
    flex:1; padding:10px 12px; border:1px solid #ddd; border-radius:10px; font-size: 14px;
}
.chat-input button{ padding:10px 14px; border:none; background:#111; color:#fff; border-radius:10px; }

.size-form{ display:grid; gap:10px; }
.size-form label{ display:grid; gap:6px; font-size:.95rem; }
.size-form input{ padding:10px 12px; border:1px solid #ddd; border-radius:10px; }
.ai-primary{ background:#111; color:#fff; border:none; padding:10px 14px; border-radius:10px; }
.ai-note{ margin-top: 4px;
    font-size: 14px;
    color: #444;
    border: 1px solid;
    border-radius: 10px;
    padding: 10px; }

@media (min-width: 992px){
    .chat-box{ height:300px; }
}