:root{--green:#0f5132;--green2:#198754;--yellow:#ffc107;--bg:#f6f8f7;--text:#1f2937;--muted:#6b7280;--border:#e5e7eb;--red:#dc3545;--blue:#0d6efd;--card:#fff}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}a{color:inherit;text-decoration:none}.container{max-width:1180px;margin:auto;padding:0 16px}.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}.header-inner{display:flex;align-items:center;gap:18px;min-height:72px}.brand{display:flex;align-items:center;gap:10px;min-width:max-content}.brand-mark{background:var(--green);color:#fff;border-radius:16px;padding:10px 11px;font-weight:800}.brand small{display:block;color:var(--muted);font-size:12px}.search-bar{display:flex;flex:1;gap:8px}.search-bar input,.form-control{width:100%;border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:#fff}.search-bar button,.btn,button{border:0;border-radius:12px;background:var(--green2);color:#fff;padding:12px 16px;font-weight:700;cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn.small{padding:8px 12px}.btn.ghost{background:#e9f5ef;color:var(--green)}.btn.red{background:var(--red)}.top-nav{display:flex;align-items:center;gap:14px;font-weight:650}.page-wrap{padding-top:22px;padding-bottom:42px}.hero{background:linear-gradient(135deg,var(--green),#1fa267);color:#fff;border-radius:28px;padding:34px;display:grid;grid-template-columns:1.2fr .8fr;gap:20px;overflow:hidden}.hero h1{font-size:42px;line-height:1.1;margin:0 0 10px}.hero p{opacity:.95;font-size:17px}.hero-card{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);padding:24px;border-radius:24px}.section-title{display:flex;align-items:center;justify-content:space-between;margin:28px 0 12px}.grid{display:grid;gap:16px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:16px;box-shadow:0 4px 16px rgba(15,81,50,.04)}.product-card{overflow:hidden;padding:0}.product-img{aspect-ratio:1.2/1;background:#e9f5ef;display:flex;align-items:center;justify-content:center;color:var(--muted)}.product-img img{width:100%;height:100%;object-fit:cover}.product-body{padding:14px}.price{font-size:18px;font-weight:800;color:var(--green)}.muted{color:var(--muted)}.badge{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:800;background:#f3f4f6;color:#374151}.badge.green{background:#d1e7dd;color:#0f5132}.badge.yellow{background:#fff3cd;color:#856404}.badge.blue{background:#cfe2ff;color:#084298}.badge.red{background:#f8d7da;color:#842029}.badge.gray{background:#e5e7eb;color:#374151}.layout{display:grid;grid-template-columns:240px 1fr;gap:18px}.sidebar{background:#fff;border:1px solid var(--border);border-radius:20px;padding:12px;height:max-content;position:sticky;top:90px}.sidebar a{display:block;padding:12px;border-radius:12px;color:#374151;font-weight:650}.sidebar a:hover{background:#e9f5ef;color:var(--green)}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--border);border-radius:20px}table{width:100%;border-collapse:collapse}th,td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}th{background:#f9fafb;font-size:13px;color:#4b5563}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-group label{display:block;font-weight:750;margin-bottom:6px}.form-actions{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}textarea.form-control{min-height:110px}.alert{padding:12px 14px;border-radius:14px;margin-bottom:14px;font-weight:650}.alert.success{background:#d1e7dd;color:#0f5132}.alert.error{background:#f8d7da;color:#842029}.bottom-nav{display:none}.site-footer{padding:26px 0;border-top:1px solid var(--border);background:#fff;color:#6b7280}.footer-inner{display:flex;justify-content:space-between;gap:12px}.category-pill{background:#fff;border:1px solid var(--border);padding:14px;border-radius:18px;font-weight:800;text-align:center}.empty{padding:30px;text-align:center;color:var(--muted)}.thumb{width:58px;height:58px;object-fit:cover;border-radius:12px;background:#f3f4f6}.store-cover{height:170px;background:linear-gradient(135deg,#d1e7dd,#fff3cd);border-radius:24px}.store-head{display:flex;gap:16px;align-items:end;margin-top:-38px;padding:0 18px 14px}.store-logo{width:86px;height:86px;border-radius:24px;border:4px solid #fff;object-fit:cover;background:#fff}.checkout-summary{position:sticky;top:90px}@media(max-width:860px){.header-inner{display:grid;grid-template-columns:1fr auto;gap:10px;padding:10px 16px}.search-bar{grid-column:1/3}.top-nav{display:none}.hero{grid-template-columns:1fr;padding:24px}.hero h1{font-size:30px}.grid-4,.grid-3,.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.layout{grid-template-columns:1fr}.sidebar{position:relative;top:auto;display:flex;overflow:auto}.sidebar a{white-space:nowrap}.form-grid{grid-template-columns:1fr}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--border);z-index:50}.bottom-nav a{text-align:center;padding:10px 4px;font-size:12px;font-weight:750}.site-footer{padding-bottom:70px}.footer-inner{display:block}.checkout-summary{position:relative;top:auto}}@media(max-width:520px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.card{border-radius:16px}.hero{border-radius:20px}.section-title{align-items:flex-start;gap:10px;flex-direction:column}.brand small{display:none}}
.eyebrow{display:inline-block;margin-bottom:10px;font-weight:700;color:#198754;background:#e9f8ef;padding:6px 10px;border-radius:999px}.service-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.service-list span{background:#f1f3f5;border-radius:999px;padding:8px 10px;font-size:13px;font-weight:700}.alert small{word-break:break-word}

/* ======================================================
   UI FIX v3: teks badge layanan di area hero/card hijau
   ====================================================== */
.hero .service-list span,
.hero-card .service-list span{
    background:#ffffff;
    color:var(--green);
    border:1px solid rgba(255,255,255,.7);
    box-shadow:0 2px 8px rgba(15,81,50,.08);
}

.hero .service-list span:hover,
.hero-card .service-list span:hover{
    background:#fff3cd;
    color:#664d03;
}

/* ======================================================
   UI FIX v4: paksa teks chip layanan hero terlihat jelas
   ====================================================== */
.hero .hero-card .service-list span,
.hero .service-list span,
.hero-card .service-list span,
.service-list.hero-service span{
    background: #ffffff !important;
    color: #0f5132 !important;
    border: 1px solid rgba(255,255,255,.85) !important;
    text-shadow: none !important;
    opacity: 1 !important;
    font-weight: 800 !important;
}
.hero .hero-card .service-list span *,
.hero .service-list span *,
.hero-card .service-list span *{
    color: #0f5132 !important;
    text-shadow: none !important;
}

/* ===== Profesional UMKM v5 ===== */
.thumb-cell{width:78px}.thumb{width:58px;height:58px;object-fit:cover;border-radius:14px;border:1px solid #dce7e1;background:#e9f8ef}.thumb.placeholder{display:flex;align-items:center;justify-content:center;font-size:11px;color:#607086;font-weight:800}.actions{white-space:nowrap}.btn.disabled{background:#eef2f0;color:#7a8b85;cursor:not-allowed}.text-red{color:#dc3545}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}.store-preview{overflow:hidden;margin-bottom:18px}.store-cover{height:190px;background:#dff5ea center/cover no-repeat}.store-preview.mini .store-cover{height:120px}.store-preview-body{display:flex;align-items:center;gap:18px;padding:20px;background:#fff}.store-logo-lg{width:82px;height:82px;min-width:82px;border-radius:24px;background:#007f4e;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;border:4px solid #fff;box-shadow:0 10px 25px rgba(0,0,0,.12);overflow:hidden}.store-logo-lg img{width:100%;height:100%;object-fit:cover}.profile-score{margin-left:auto;text-align:center;background:#effaf3;border:1px solid #ccebd8;border-radius:18px;padding:14px 18px}.profile-score b{display:block;font-size:26px;color:#006b42}.profile-score span{font-size:12px;color:#607086}.check-grid{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.check-grid label,.checklist label{background:#f8faf9;border:1px solid #dce7e1;border-radius:14px;padding:10px 12px;font-weight:700;display:inline-flex;gap:8px;align-items:center}.checklist{display:grid;gap:8px}.image-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;margin:12px 0 18px}.image-admin-item{border:1px solid #dce7e1;border-radius:16px;padding:10px;background:#fff}.image-admin-item img{width:100%;height:110px;object-fit:cover;border-radius:12px;background:#e9f8ef}.image-admin-item label{display:block;margin-top:6px;font-size:12px}.product-main-img{min-height:390px;border-radius:18px;background:#e9f8ef;display:flex;align-items:center;justify-content:center;color:#607086;overflow:hidden}.product-main-img img{width:100%;height:100%;max-height:520px;object-fit:contain}.thumb-gallery{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.thumb-gallery button{padding:0;border:2px solid #dce7e1;border-radius:12px;background:white;cursor:pointer;overflow:hidden}.thumb-gallery img{width:72px;height:72px;object-fit:cover;display:block}.big-price{font-size:30px}.qty-input{max-width:100px}.notif-item,.order-mini,.admin-list-item{padding:10px 0;border-bottom:1px solid #edf1ef}.notif-item:last-child,.order-mini:last-child,.admin-list-item:last-child{border-bottom:0}.notif-item p{margin:4px 0;color:#607086}.order-mini{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;align-items:center}.admin-list-item{display:flex;gap:12px;align-items:center}.admin-list-item>div{flex:1}.alert-card{text-decoration:none;color:inherit;border-color:#ffe69c;background:#fff9e6}small{color:#607086}.no-padding{padding:0!important}
@media(max-width:768px){.store-preview-body{align-items:flex-start;flex-wrap:wrap}.profile-score{margin-left:0}.order-mini{grid-template-columns:1fr}.product-main-img{min-height:260px}.thumb-gallery img{width:58px;height:58px}.actions{white-space:normal}.table-wrap{overflow-x:auto}.store-cover{height:140px}}
.p-16{padding:16px}.product-main-img[src]{width:100%;height:auto;max-height:520px;object-fit:contain;background:#e9f8ef}.upload-help{background:#fff8e1;border:1px solid #ffe08a;border-radius:14px;padding:12px 14px;margin:10px 0;color:#7a5600;font-weight:700}

/* ===== v7: deskripsi aman + animasi halus + driver lokal ===== */
.product-description,
.card p,
.card div,
td,
.product-body,
.store-preview-body{
    overflow-wrap:anywhere;
    word-break:break-word;
}
.product-description{
    max-width:100%;
    white-space:normal;
    line-height:1.75;
    background:#f8faf9;
    border:1px solid #e4eee8;
    border-radius:16px;
    padding:14px;
    color:#334155;
}

@keyframes softFadeUp{
    from{opacity:0;transform:translateY(12px)}
    to{opacity:1;transform:translateY(0)}
}
@keyframes softFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-4px)}
}
@keyframes shimmerGlow{
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
.page-wrap > *, .animated-card, .product-card, .category-pill, .table-wrap, .store-preview{
    animation:softFadeUp .45s ease both;
}
.card,
.product-card,
.category-pill,
.table-wrap,
.btn,
button,
.sidebar a{
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.card:hover,
.product-card:hover,
.category-pill:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(15,81,50,.08);
    border-color:#cfe8da;
}
button:hover,.btn:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 18px rgba(15,81,50,.16);
}
.hero{
    background:linear-gradient(135deg,#0f5132,#159957,#1fa267);
    background-size:220% 220%;
    animation:shimmerGlow 8s ease infinite;
}
.hero-card{animation:softFloat 4s ease-in-out infinite}
tbody tr:hover{background:#fbfdfc}
.form-control:focus{
    outline:0;
    border-color:#72c79b;
    box-shadow:0 0 0 4px rgba(25,135,84,.12);
}

.driver-card{position:relative;overflow:hidden}
.driver-card:before{
    content:"";
    position:absolute;
    inset:0 0 auto 0;
    height:5px;
    background:linear-gradient(90deg,#0f5132,#20c997,#ffc107);
}
.driver-avatar{
    width:56px;height:56px;border-radius:18px;background:#0f5132;color:#fff;
    display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;
    box-shadow:0 12px 24px rgba(15,81,50,.18);
}
.soft-info{
    background:#f0fbf5;
    border:1px solid #ccebd8;
    border-radius:16px;
    padding:14px;
}
.order-line{
    display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed #e4eee8;padding:10px 0;
}
.order-line:last-child{border-bottom:0}
@media (prefers-reduced-motion: reduce){
    *, *:before, *:after{animation:none!important;transition:none!important}
}

/* v8: toko, keranjang multi produk, dan driver registration */
.product-description-box,
.long-text,
.product-description-box p,
.card p {
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
}
.product-description-box {
    border-left: 5px solid var(--primary, #008b57);
    background: linear-gradient(180deg, #fff, #f8fffb);
}
.store-product-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.store-product-card .product-link {
    display: block;
    color: inherit;
    text-decoration: none;
    flex: 1;
}
.store-product-card .mini-cart-form {
    padding: 0 14px 14px;
}
.mini-cart-form button,
button.small,
.btn.small {
    border-radius: 12px;
    padding: 10px 13px;
    font-size: 13px;
}
.store-service-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.audit-photo {
    min-height: 180px;
    border: 1px solid #dbe7e0;
    border-radius: 18px;
    background: #effaf4;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: #657489;
    margin-top: 8px;
}
.audit-photo img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}
.audit-box {
    border: 1px solid #e3ece7;
    border-radius: 18px;
    padding: 16px;
    background: #fbfffd;
}
.required { color: #dc3545; }
.auth-card .soft-info { margin: 14px 0; }
@media (max-width: 860px) {
    .top-nav a[href$="register_driver.php"] { display: inline-flex; }
    .audit-photo img { height: 180px; }
}

/* === v9 Notification Bell + Personal Chat === */
.notif-wrap{position:relative;display:inline-flex;align-items:center}
.notif-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:14px;background:#f1f8f4;text-decoration:none;font-size:18px;transition:.2s ease}
.notif-bell:hover{transform:translateY(-2px);background:#dff5e9}
.notif-count,.nav-dot{position:absolute;top:-6px;right:-6px;background:#dc3545;color:#fff;border-radius:999px;min-width:19px;height:19px;padding:0 5px;font-size:11px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;box-shadow:0 4px 12px rgba(220,53,69,.25)}
.nav-badge-link{position:relative;display:inline-flex;align-items:center}
.notif-dropdown{display:none;position:absolute;right:0;top:44px;width:330px;background:#fff;border:1px solid #e4e9ee;border-radius:18px;box-shadow:0 18px 55px rgba(15,23,42,.14);z-index:30;overflow:hidden}
.notif-wrap:hover .notif-dropdown{display:block;animation:softDrop .18s ease}
@keyframes softDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.notif-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #eef2f5}
.notif-head a{font-size:12px;color:#006b3d;text-decoration:none}
.notif-item{display:block;padding:12px 16px;border-bottom:1px solid #f0f3f5;text-decoration:none;color:#12213a;background:#fff}
.notif-item:hover{background:#f6fbf8}
.notif-item.unread{background:#effaf4}
.notif-item b{display:block;font-size:14px;margin-bottom:4px}
.notif-item small{display:block;color:#64748b;line-height:1.35}
.notif-empty{padding:18px;color:#64748b}
.notif-row{display:flex;justify-content:space-between;gap:14px;padding:16px;border-bottom:1px solid #eef2f5;border-radius:12px}
.notif-row.unread{background:#effaf4}
.notif-row p{margin:6px 0;color:#475569;overflow-wrap:anywhere;word-break:break-word}
.notif-row small{color:#94a3b8}
.chat-list{padding:0;overflow:hidden}
.chat-row{display:flex;align-items:center;gap:14px;padding:16px;border-bottom:1px solid #edf2f4;text-decoration:none;color:#12213a;transition:.18s ease;position:relative}
.chat-row:hover{background:#f7fbf8;transform:translateX(3px)}
.chat-row.unread{background:#effaf4}
.chat-avatar{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,#00945a,#74d69d);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 10px 24px rgba(0,148,90,.18)}
.chat-main{flex:1;min-width:0}
.chat-main b{display:block;margin-bottom:3px}
.chat-main small{display:block;color:#64748b;margin-bottom:5px}
.chat-main p{margin:0;color:#475569;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notif-count.inline{position:static;min-width:24px;height:24px;margin-left:auto}
.chat-box{padding:0;overflow:hidden}
.chat-thread{padding:18px;min-height:360px;max-height:60vh;overflow:auto;background:linear-gradient(180deg,#f8fcfa,#ffffff)}
.bubble{max-width:76%;padding:12px 14px;margin:10px 0;border-radius:18px;box-shadow:0 8px 24px rgba(15,23,42,.06);overflow-wrap:anywhere;word-break:break-word;animation:fadeUp .2s ease}
.bubble small{display:block;font-size:11px;margin-bottom:5px;opacity:.74}
.bubble p{margin:0;line-height:1.45}
.bubble.me{margin-left:auto;background:#00945a;color:#fff;border-bottom-right-radius:6px}
.bubble.them{background:#fff;color:#12213a;border:1px solid #e9eef2;border-bottom-left-radius:6px}
.chat-form{display:flex;gap:10px;padding:14px;border-top:1px solid #eef2f5;background:#fff;align-items:flex-end}
.chat-form textarea{min-height:52px;resize:vertical;margin:0}
.chat-form button{height:52px;min-width:110px}
@media (max-width:760px){.notif-dropdown{right:-110px;width:300px}.chat-form{flex-direction:column}.chat-form button{width:100%}.bubble{max-width:92%}}
/* v10 driver delivery flow */
.driver-status-card{display:flex;justify-content:space-between;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff,#e7f9f0);border:1px solid #d7efe4;border-radius:22px;padding:22px;box-shadow:0 12px 35px rgba(15,81,50,.08)}
.driver-toggle-form{display:flex;gap:10px;align-items:center;min-width:330px}
.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}
.stat-card{display:block;text-decoration:none;color:var(--text);background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:0 10px 26px rgba(0,0,0,.05);transition:.2s}
.stat-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(0,0,0,.08)}
.stat-card b{display:block;font-size:32px;color:var(--green)}
.stat-card span{color:var(--muted)}
.delivery-offer{border-left:5px solid var(--green)}
.inline-actions{display:flex;gap:8px;flex-wrap:wrap}.inline-actions button{margin:0}.inline-actions .danger,.red,.danger{background:#dc3545!important;color:#fff!important}
.delivery-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px;margin-top:12px}
.timeline-step{background:#f7f9fa;border:1px solid var(--border);border-radius:16px;padding:12px;min-height:86px;color:var(--muted);transition:.2s}
.timeline-step span{display:inline-flex;width:28px;height:28px;border-radius:50%;background:#e9ecef;align-items:center;justify-content:center;font-weight:800;margin-bottom:8px;color:#566}
.timeline-step.done{background:#e7f9f0;border-color:#bfead7;color:var(--text);box-shadow:0 8px 20px rgba(15,81,50,.06)}
.timeline-step.done span{background:var(--green);color:#fff}.timeline-step b{display:block;font-size:13px;line-height:1.25}
.driver-mini-card{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:14px;border-radius:18px;background:#f7fffb;border:1px solid #cfeede}
.chat-card .chat-box{max-height:520px;overflow:auto;background:#f8faf9;border:1px solid var(--border);border-radius:18px;padding:14px}.chat-bubble{max-width:76%;margin:10px 0;padding:10px 12px;border-radius:16px;background:#fff;border:1px solid var(--border)}.chat-bubble.mine{margin-left:auto;background:#e3f7ee;border-color:#bfead7}.chat-bubble small{display:block;font-weight:700;color:var(--muted)}.chat-bubble p{margin:4px 0;white-space:pre-wrap;word-break:break-word}.chat-bubble em{font-size:11px;color:var(--muted);font-style:normal}.chat-form{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}.chat-form textarea{min-height:52px}
@media(max-width:780px){.driver-status-card,.driver-mini-card,.driver-toggle-form{display:block}.driver-toggle-form .form-control,.driver-toggle-form button{width:100%;margin-top:8px}.stats-grid{grid-template-columns:1fr}.chat-form{grid-template-columns:1fr}.chat-bubble{max-width:96%}}

/* v13 realtime chat */
.chat-status-ok{color:#007f4f;font-weight:700}.chat-status-warn{color:#b45309;font-weight:700}.chat-pop{animation:chatPop .18s ease-out}.chat-bubble,.bubble{word-break:break-word;overflow-wrap:anywhere}.chat-bubble p,.bubble p{white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}@keyframes chatPop{from{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}.realtime-chat .chat-thread,.realtime-chat .chat-box{scroll-behavior:smooth}.chat-form button:disabled{opacity:.7;cursor:not-allowed}