/* ═══════════════════════════════════════════════════════════
   CHAT PANEL — Floating Quick Access Panel
   assets/appointment/css/chat-panel.css
═══════════════════════════════════════════════════════════ */

/* ── Float Button ────────────────────────────────────────── */
.cp-fab{
    position:fixed;bottom:30px;right:30px;width:54px;height:54px;
    background:linear-gradient(135deg,#1e2d6b,#3b4fd8);
    border-radius:50%;display:flex;align-items:center;justify-content:center;
    cursor:pointer;z-index:9998;box-shadow:0 4px 20px rgba(30,45,107,.4);
    transition:transform .2s,box-shadow .2s;
}
.cp-fab:hover{ transform:scale(1.08);box-shadow:0 6px 28px rgba(30,45,107,.55); }
.cp-fab .cp-fab-ico{ font-size:22px;color:#fff;transition:transform .3s; }
.cp-fab .cp-fab-close{ font-size:20px;color:#fff;display:none; }
.cp-fab.open .cp-fab-ico{ display:none; }
.cp-fab.open .cp-fab-close{ display:block; }

/* Pulse ring */
.cp-fab::after{
    content:'';position:absolute;width:100%;height:100%;border-radius:50%;
    border:2px solid rgba(59,79,216,.5);
    animation:cp-pulse 2.5s ease-out infinite;
}
@keyframes cp-pulse{ 0%{transform:scale(1);opacity:1} 100%{transform:scale(1.7);opacity:0} }

/* ── Panel ───────────────────────────────────────────────── */
.cp-panel{
    position:fixed;bottom:96px;right:30px;width:480px;height:640px;
    background:#fff;border-radius:16px;
    box-shadow:0 8px 40px rgba(0,0,0,.18);
    z-index:9997;display:flex;flex-direction:column;overflow:hidden;
    transform:scale(.9) translateY(20px);opacity:0;
    pointer-events:none;transition:transform .25s,opacity .25s;
}
.cp-panel.open{ transform:scale(1) translateY(0);opacity:1;pointer-events:all; }

/* ── Header ──────────────────────────────────────────────── */
.cp-header{
    background:linear-gradient(135deg,#1e2d6b,#3b4fd8);
    padding:16px 20px;display:flex;align-items:center;gap:12px;flex-shrink:0;
}
.cp-header-avatar{
    width:36px;height:36px;border-radius:50%;
    background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;
    font-size:16px;color:#fff;
}
.cp-header-title{ flex:1;color:#fff; }
.cp-header-title h6{ margin:0;font-weight:700;font-size:14px; }
.cp-header-title span{ font-size:11px;opacity:.8; }

/* ── Body ────────────────────────────────────────────────── */
.cp-body{ display:flex;flex:1;overflow:hidden; }

/* ── Side Nav ────────────────────────────────────────────── */
.cp-nav{
    width:68px;background:#f8faff;border-right:1px solid #e8eef8;
    display:flex;flex-direction:column;align-items:center;
    padding:8px 0;gap:2px;flex-shrink:0;overflow-y:auto;
}
.cp-nav-item{
    width:52px;height:52px;border-radius:10px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    cursor:pointer;transition:all .15s;position:relative;
    color:#94a3b8;font-size:19px;
}
.cp-nav-item:hover{ background:#eff0ff;color:#1e2d6b; }
.cp-nav-item.active{ background:#1e2d6b;color:#fff; }
.cp-nav-item .cp-nav-label{
    font-size:9px;font-weight:700;margin-top:3px;
    text-align:center;line-height:1.1;letter-spacing:.2px;
}
.cp-nav-divider{ width:32px;height:1px;background:#dde1f0;margin:4px 0;flex-shrink:0; }
.cp-nav-chat{ margin-top:auto; }
.cp-nav-item.chat-active{ background:linear-gradient(135deg,#6d28d9,#8b5cf6);color:#fff; }

/* ── Content ─────────────────────────────────────────────── */
.cp-content{ flex:1;overflow-y:auto;padding:0; }
.cp-module{ display:none;height:100%; }
.cp-module.active{ display:flex;flex-direction:column; }

.cp-module-header{
    padding:14px 16px 10px;border-bottom:1px solid #f0f4ff;
    display:flex;align-items:center;gap:8px;flex-shrink:0;
}
.cp-module-header h6{ margin:0;font-weight:700;color:#1e2d6b;font-size:14px; }
.cp-module-body{ flex:1;overflow-y:auto;padding:12px 14px; }

/* Loader */
.cp-loader{ text-align:center;padding:40px 20px;color:#94a3b8; }
.cp-loader i{ font-size:28px;margin-bottom:10px;display:block; }

/* ── Hizmet kartları ──────────────────────────────────────── */
.cp-svc-card{
    border:1px solid #e8eef8;border-radius:10px;padding:10px 14px;
    margin-bottom:8px;cursor:pointer;transition:all .15s;background:#fff;
    display:flex;align-items:center;justify-content:between;gap:10px;
}
.cp-svc-card:hover{ border-color:#1e2d6b;background:#f8faff;transform:translateX(3px); }
.cp-svc-card .cp-svc-name{ font-weight:600;font-size:13px;color:#1e2d6b;flex:1; }
.cp-svc-card .cp-svc-meta{ font-size:11px;color:#94a3b8; }
.cp-svc-card .cp-svc-price{ font-weight:700;color:#16a34a;font-size:12px; }
.cp-breadcrumb{
    font-size:11px;color:#94a3b8;padding:8px 14px 0;
    display:flex;align-items:center;gap:4px;
}
.cp-breadcrumb a{ color:#3b4fd8;cursor:pointer;text-decoration:none; }

/* ── Ürünler ─────────────────────────────────────────────── */
.cp-search{
    padding:10px 14px;border-bottom:1px solid #f0f4ff;flex-shrink:0;
}
.cp-search input{
    width:100%;border:1px solid #dde1f0;border-radius:8px;
    padding:7px 12px 7px 32px;font-size:13px;outline:none;
    background:#f8faff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 10px center;
}
.cp-product-item{
    border:1px solid #e8eef8;border-radius:8px;padding:10px 12px;
    margin-bottom:6px;display:flex;align-items:center;gap:10px;
}
.cp-product-item .cp-prd-name{ font-weight:600;font-size:12px;flex:1; }
.cp-product-item .cp-prd-cat{ font-size:10px;color:#94a3b8; }
.cp-product-item .cp-prd-price{ font-weight:700;color:#065f46;font-size:12px;white-space:nowrap; }
.cp-product-item .cp-prd-stock{
    font-size:10px;padding:2px 7px;border-radius:10px;white-space:nowrap;
}
.cp-stock-ok{ background:#dcfce7;color:#166534; }
.cp-stock-low{ background:#fef3c7;color:#92400e; }
.cp-stock-out{ background:#fee2e2;color:#dc2626; }

/* ── Stat kartları ───────────────────────────────────────── */
.cp-stat-grid{ display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px; }
.cp-stat-card{
    border-radius:10px;padding:12px 14px;
}
.cp-stat-card .cp-stat-val{ font-size:24px;font-weight:900;line-height:1; }
.cp-stat-card .cp-stat-lbl{ font-size:11px;opacity:.85;margin-top:3px; }
.cp-stat-blue{ background:linear-gradient(135deg,#1e2d6b,#3b4fd8);color:#fff; }
.cp-stat-green{ background:linear-gradient(135deg,#065f46,#16a34a);color:#fff; }
.cp-stat-orange{ background:linear-gradient(135deg,#92400e,#d97706);color:#fff; }
.cp-stat-purple{ background:linear-gradient(135deg,#5b21b6,#7c3aed);color:#fff; }

/* ── Personel durumu ──────────────────────────────────────── */
.cp-pers-item{
    display:flex;align-items:center;gap:10px;
    padding:8px 0;border-bottom:1px solid #f0f4ff;
}
.cp-pers-item:last-child{ border-bottom:none; }
.cp-pers-avatar{
    width:34px;height:34px;border-radius:50%;
    background:#e8eef8;display:flex;align-items:center;justify-content:center;
    font-size:13px;font-weight:700;color:#1e2d6b;flex-shrink:0;
}
.cp-pers-name{ font-weight:600;font-size:13px;flex:1; }
.cp-pers-status{
    font-size:10px;font-weight:700;padding:3px 8px;border-radius:10px;
}
.cp-status-free{ background:#dcfce7;color:#166534; }
.cp-status-busy{ background:#fee2e2;color:#dc2626; }
.cp-status-break{ background:#fef3c7;color:#92400e; }

/* ── Kasa ────────────────────────────────────────────────── */
.cp-kasa-row{
    display:flex;align-items:center;justify-content:space-between;
    padding:10px 0;border-bottom:1px solid #f0f4ff;
}
.cp-kasa-row:last-child{ border-bottom:none; }
.cp-kasa-lbl{ font-size:13px;color:#374151;display:flex;align-items:center;gap:8px; }
.cp-kasa-val{ font-size:15px;font-weight:700;color:#1e2d6b; }

/* ── Doğum günleri ───────────────────────────────────────── */
.cp-bday-item{
    display:flex;align-items:center;gap:10px;
    padding:8px 0;border-bottom:1px solid #f0f4ff;
}
.cp-bday-item:last-child{ border-bottom:none; }
.cp-bday-cake{ font-size:20px;flex-shrink:0; }
.cp-bday-name{ font-weight:600;font-size:13px;flex:1; }
.cp-bday-age{ font-size:11px;color:#94a3b8; }
.cp-bday-btn{
    font-size:11px;padding:3px 8px;border-radius:6px;
    background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe;
    cursor:pointer;text-decoration:none;
}

/* ── SMS ─────────────────────────────────────────────────── */
.cp-sms-cus{
    border:1px solid #dde1f0;border-radius:8px;padding:8px 12px;
    margin-bottom:6px;cursor:pointer;display:flex;align-items:center;gap:8px;
    transition:.12s;
}
.cp-sms-cus:hover{ border-color:#3b4fd8;background:#f8faff; }
.cp-sms-cus.selected{ border-color:#1e2d6b;background:#eff0ff; }
.cp-sms-template{
    border:1px solid #dde1f0;border-radius:8px;padding:8px 12px;
    margin-bottom:6px;cursor:pointer;transition:.12s;
}
.cp-sms-template:hover,.cp-sms-template.selected{ border-color:#1e2d6b;background:#f8faff; }
.cp-sms-count{ font-size:11px;color:#94a3b8;text-align:right;margin-top:4px; }

/* ── AI Chat ─────────────────────────────────────────────── */
.cp-chat-messages{
    flex:1;overflow-y:auto;padding:12px 14px;
    display:flex;flex-direction:column;gap:10px;
}
.cp-msg{ max-width:85%;display:flex;flex-direction:column;gap:3px; }
.cp-msg-user{ align-self:flex-end;align-items:flex-end; }
.cp-msg-bot{ align-self:flex-start;align-items:flex-start; }
.cp-msg-bubble{
    padding:9px 13px;border-radius:12px;font-size:13px;line-height:1.5;
}
.cp-msg-user .cp-msg-bubble{
    background:linear-gradient(135deg,#1e2d6b,#3b4fd8);color:#fff;
    border-radius:12px 12px 2px 12px;
}
.cp-msg-bot .cp-msg-bubble{
    background:#f0f4ff;color:#1e2d6b;
    border-radius:12px 12px 12px 2px;
}
.cp-msg-time{ font-size:10px;color:#94a3b8; }
.cp-chat-input-wrap{
    padding:10px 14px;border-top:1px solid #f0f4ff;
    display:flex;gap:8px;flex-shrink:0;background:#fff;
}
.cp-chat-input{
    flex:1;border:1px solid #dde1f0;border-radius:20px;
    padding:8px 14px;font-size:13px;outline:none;background:#f8faff;
    transition:border-color .15s;
}
.cp-chat-input:focus{ border-color:#1e2d6b;background:#fff; }
.cp-chat-send{
    width:36px;height:36px;border-radius:50%;
    background:linear-gradient(135deg,#1e2d6b,#3b4fd8);
    border:none;color:#fff;font-size:14px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:.15s;flex-shrink:0;
}
.cp-chat-send:hover{ transform:scale(1.08); }
.cp-typing{ display:flex;gap:4px;padding:4px 0; }
.cp-typing span{
    width:7px;height:7px;border-radius:50%;background:#94a3b8;
    animation:cp-typing .8s infinite;
}
.cp-typing span:nth-child(2){ animation-delay:.15s; }
.cp-typing span:nth-child(3){ animation-delay:.3s; }
@keyframes cp-typing{ 0%,60%,100%{transform:translateY(0)} 30%{transform:translateY(-6px)} }
.cp-chat-suggestions{
    padding:6px 14px 0;display:flex;flex-wrap:wrap;gap:5px;flex-shrink:0;
}
.cp-suggestion{
    background:#f0f4ff;color:#1e2d6b;border:1px solid #c7d2fe;
    border-radius:16px;padding:4px 11px;font-size:11px;cursor:pointer;
    transition:.12s;
}
.cp-suggestion:hover{ background:#1e2d6b;color:#fff; }

/* ── Müşteri arama ───────────────────────────────────────── */
.cp-cus-item{
    border:1px solid #e8eef8;border-radius:8px;padding:10px 12px;
    margin-bottom:6px;cursor:pointer;transition:.12s;
    display:flex;align-items:center;gap:10px;
}
.cp-cus-item:hover{ border-color:#1e2d6b;background:#f8faff; }
.cp-cus-avatar{
    width:34px;height:34px;border-radius:50%;
    background:linear-gradient(135deg,#1e2d6b,#3b4fd8);
    font-size:12px;font-weight:700;color:#fff;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.cp-cus-name{ font-weight:600;font-size:13px; }
.cp-cus-phone{ font-size:11px;color:#94a3b8; }

/* ── Scrollbar ───────────────────────────────────────────── */
.cp-content::-webkit-scrollbar,
.cp-module-body::-webkit-scrollbar,
.cp-chat-messages::-webkit-scrollbar{ width:4px; }
.cp-content::-webkit-scrollbar-track,
.cp-module-body::-webkit-scrollbar-track,
.cp-chat-messages::-webkit-scrollbar-track{ background:transparent; }
.cp-content::-webkit-scrollbar-thumb,
.cp-module-body::-webkit-scrollbar-thumb,
.cp-chat-messages::-webkit-scrollbar-thumb{ background:#dde1f0;border-radius:4px; }

/* ── Responsive ──────────────────────────────────────────── */
@media(max-width:520px){
    .cp-panel{ width:calc(100vw - 20px);right:10px;bottom:80px;height:70vh; }
    .cp-fab{ bottom:16px;right:16px; }
}

/* ── Hızlı Linkler ───────────────────────────────────────── */
.cp-link-item{
    display:flex;align-items:center;gap:10px;
    padding:9px 12px;border-radius:8px;margin-bottom:5px;
    background:#f8faff;border:1px solid #e8eef8;
    color:#1e2d6b;font-size:13px;font-weight:500;
    text-decoration:none;transition:all .15s;
}
.cp-link-item:hover{ background:#eff0ff;border-color:#c7d2fe;color:#1e2d6b;text-decoration:none;transform:translateX(2px); }
.cp-link-item i:first-child{ width:16px;text-align:center;color:#3b4fd8;flex-shrink:0; }
.cp-link-ext{ margin-left:auto;font-size:10px;color:#c7d2fe; }