/* dc-theme.css — one colour system for the whole app, loaded last (includes/header.php) so it improves every page without editing it.
 * Each area has a colour: use the classes c-indigo c-violet c-emerald c-amber c-rose c-sky c-teal c-slate on a card/tile/stat.
 * Corners stay square (house style). Contrast: all text colours here are >= 4.5:1 on their backgrounds. */
:root {
  --dc-ink: #0f172a; --dc-text: #334155; --dc-muted: #64748b; --dc-line: #e2e8f0; --dc-soft: #f8fafc;
  --dc-brand: #4f46e5; --dc-brand-2: #7c3aed; --dc-brand-dark: #3730a3;
  --dc-grad: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  --dc-ring: 0 0 0 .22rem rgba(79, 70, 229, .22);
}
.c-indigo  { --c: #4f46e5; --c-bg: #eef2ff; --c-dark: #3730a3; }
.c-violet  { --c: #7c3aed; --c-bg: #f5f3ff; --c-dark: #5b21b6; }
.c-emerald { --c: #059669; --c-bg: #ecfdf5; --c-dark: #047857; }
.c-amber   { --c: #d97706; --c-bg: #fffbeb; --c-dark: #b45309; }
.c-rose    { --c: #e11d48; --c-bg: #fff1f2; --c-dark: #be123c; }
.c-sky     { --c: #0284c7; --c-bg: #f0f9ff; --c-dark: #0369a1; }
.c-teal    { --c: #0d9488; --c-bg: #f0fdfa; --c-dark: #0f766e; }
.c-slate   { --c: #475569; --c-bg: #f1f5f9; --c-dark: #334155; }

/* ---------- Links ---------- */
main a:not(.btn):not(.dropdown-item):not(.nav-link):not(.page-link):not(.list-group-item):not(.card):not(.badge):not(.accordion-button):not(.sb-link):not([class*="text-"]):not([class*="dc-"]) { color: var(--dc-brand); text-decoration-thickness: 1px; text-underline-offset: 3px; }
main a:not(.btn):not(.dropdown-item):not(.nav-link):not(.page-link):not(.list-group-item):not(.card):not(.badge):not(.accordion-button):not(.sb-link):not([class*="text-"]):not([class*="dc-"]):hover { color: var(--dc-brand-dark); text-decoration-thickness: 2px; }
a.card, a.card:hover { text-decoration: none; }
.breadcrumb a { text-decoration: none; font-weight: 600; }
/* Every underlined link, whatever its colour class: a thin, offset line in a softened version of the link colour that firms up on hover,
 * a visible keyboard focus ring, and no underline on controls that only look like buttons or menu entries. */
a:where(:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item):not(.card):not(.badge):not(.accordion-button):not(.sb-link):not(.navbar-brand):not(.bottom-nav-item)) {
  text-decoration-thickness: 1px; text-underline-offset: .22em; text-decoration-skip-ink: auto;
  text-decoration-color: color-mix(in srgb, currentColor 38%, transparent);
  transition: color .15s ease, text-decoration-color .15s ease, text-decoration-thickness .15s ease;
}
a:where(:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item):not(.card):not(.badge):not(.accordion-button):not(.sb-link):not(.navbar-brand):not(.bottom-nav-item)):hover {
  text-decoration-color: currentColor; text-decoration-thickness: 2px;
}
a:focus-visible { outline: 2px solid var(--dc-brand); outline-offset: 2px; border-radius: 2px; }
a.text-decoration-none, a.text-decoration-none:hover, .btn, .btn:hover, .nav-link, .dropdown-item, .page-link, .sb-link, .bottom-nav-item { text-decoration: none !important; }
footer a, .main-footer a { text-decoration-color: color-mix(in srgb, currentColor 30%, transparent); }

/* ---------- Buttons ---------- */
.btn { font-weight: 600; letter-spacing: .01em; transition: transform .15s, box-shadow .15s, background-color .15s, border-color .15s, color .15s; }
.btn:focus-visible { outline: 0; box-shadow: var(--dc-ring) !important; }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--dc-grad); border: 0; color: #fff; box-shadow: 0 4px 14px rgba(79, 70, 229, .28); }
.btn-primary:hover, .btn-primary:focus { background: var(--dc-grad); filter: brightness(1.08); color: #fff; transform: translateY(-1px); box-shadow: 0 8px 22px rgba(79, 70, 229, .36); }
.btn-success { background: linear-gradient(135deg, #059669, #10b981); border: 0; color: #fff; box-shadow: 0 4px 12px rgba(5, 150, 105, .25); }
.btn-success:hover { background: linear-gradient(135deg, #047857, #059669); color: #fff; transform: translateY(-1px); }
.btn-danger { background: linear-gradient(135deg, #e11d48, #f43f5e); border: 0; color: #fff; box-shadow: 0 4px 12px rgba(225, 29, 72, .22); }
.btn-danger:hover { background: linear-gradient(135deg, #be123c, #e11d48); color: #fff; transform: translateY(-1px); }
.btn-warning { background: linear-gradient(135deg, #f59e0b, #fbbf24); border: 0; color: #451a03; }
.btn-warning:hover { background: linear-gradient(135deg, #d97706, #f59e0b); color: #451a03; }
.btn-info { background: linear-gradient(135deg, #0284c7, #0ea5e9); border: 0; color: #fff; }
.btn-info:hover { background: linear-gradient(135deg, #0369a1, #0284c7); color: #fff; }
.btn-dark { background: linear-gradient(135deg, #0f172a, #1e293b); border: 0; color: #fff; }
.btn-dark:hover { background: linear-gradient(135deg, #1e293b, #334155); color: #fff; transform: translateY(-1px); }
.btn-light { background: #fff; border: 1px solid var(--dc-line); color: var(--dc-text); }
.btn-light:hover { background: var(--dc-soft); border-color: #cbd5e1; }
.btn-outline-primary { color: var(--dc-brand); border: 1.5px solid #a5b4fc; background: #fff; }
.btn-outline-primary:hover, .btn-outline-primary:focus { background: var(--dc-brand); border-color: var(--dc-brand); color: #fff; }
.btn-outline-secondary { color: var(--dc-text); border: 1.5px solid #cbd5e1; background: #fff; }
.btn-outline-secondary:hover { background: #f1f5f9; border-color: #94a3b8; color: var(--dc-ink); }
.btn-outline-success { color: #047857; border: 1.5px solid #6ee7b7; background: #fff; }
.btn-outline-success:hover { background: #059669; border-color: #059669; color: #fff; }
.btn-outline-danger { color: #be123c; border: 1.5px solid #fda4af; background: #fff; }
.btn-outline-danger:hover { background: #e11d48; border-color: #e11d48; color: #fff; }
.btn-outline-warning { color: #b45309; border: 1.5px solid #fcd34d; background: #fff; }
.btn-outline-warning:hover { background: #f59e0b; border-color: #f59e0b; color: #451a03; }
.btn-outline-dark { color: var(--dc-ink); border: 1.5px solid #94a3b8; background: #fff; }
.btn-outline-dark:hover { background: var(--dc-ink); border-color: var(--dc-ink); color: #fff; }
.btn-link { color: var(--dc-brand); font-weight: 600; }
.btn-sm { padding: .32rem .7rem; }
.btn:disabled, .btn.disabled { opacity: .55; transform: none; box-shadow: none; }

/* ---------- Forms ---------- */
.form-label { font-weight: 600; color: var(--dc-text); margin-bottom: .3rem; }
.form-control, .form-select, .input-group-text { border: 1.5px solid #cbd5e1; background-color: #fff; color: var(--dc-ink); }
.form-control, .form-select { padding: .55rem .8rem; transition: border-color .15s, box-shadow .15s, background-color .15s; }
.form-control-sm, .form-select-sm { padding: .35rem .6rem; }
.form-control::placeholder, textarea::placeholder { color: #94a3b8; }
.form-control:hover, .form-select:hover { border-color: #94a3b8; }
.form-control:focus, .form-select:focus { border-color: var(--dc-brand); box-shadow: var(--dc-ring); background-color: #fff; }
.form-control:disabled, .form-control[readonly], .form-select:disabled { background-color: #f1f5f9; color: var(--dc-muted); }
.input-group-text { background: #eef2ff; color: var(--dc-brand-dark); font-weight: 600; }
.form-check-input { border: 1.5px solid #94a3b8; }
.form-check-input:checked { background-color: var(--dc-brand); border-color: var(--dc-brand); }
.form-check-input:focus { box-shadow: var(--dc-ring); border-color: var(--dc-brand); }
.form-check-label { color: var(--dc-text); }
.form-text { color: var(--dc-muted); }
.form-control:user-invalid, .form-select:user-invalid { border-color: #fb7185; }
input[type="file"].form-control { background: #f8fafc; border-style: dashed; padding: .5rem .6rem; }
input[type="file"].form-control::file-selector-button { background: #eef2ff; color: var(--dc-brand-dark); border: 0; border-right: 1.5px solid #cbd5e1; margin: -.5rem .8rem -.5rem -.6rem; padding: .6rem 1rem; font-weight: 600; }
input[type="range"]::-webkit-slider-thumb { background: var(--dc-brand); }
.dc-upload-item img { border: 1.5px solid #c7d2fe !important; }

/* ---------- Cards ---------- */
main .card { border: 1px solid #e8edf5; box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px rgba(15, 23, 42, .04); }
main .card .card-header { background: linear-gradient(180deg, #fafbff, #f4f6fd); border-bottom: 1px solid #e8edf5; font-weight: 700; color: var(--dc-ink); }
main .card.bg-light { background: #f5f7ff !important; border-color: #e0e7ff; }
/* coloured cards: add c-<colour> (and dc-accent for a top bar) */
.dc-accent { border-top: 4px solid var(--c, var(--dc-brand)) !important; }
.dc-accent-left { border-left: 4px solid var(--c, var(--dc-brand)) !important; }
.dc-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; background: var(--c-bg, #eef2ff); color: var(--c, var(--dc-brand)); font-size: 1.3rem; flex: none; }
.dc-icon.sm { width: 34px; height: 34px; font-size: 1rem; }
a.dc-tile { display: block; color: var(--dc-ink); border-left: 4px solid var(--c) !important; transition: transform .18s, box-shadow .18s, background-color .18s; }
a.dc-tile:hover { transform: translateY(-3px); background: var(--c-bg); box-shadow: 0 14px 30px rgba(15, 23, 42, .10) !important; }
a.dc-tile .dc-title { font-weight: 700; margin-top: .6rem; color: var(--dc-ink); }
a.dc-tile .dc-desc { font-size: .8rem; color: var(--dc-muted); }
a.dc-tile:hover .dc-title { color: var(--c-dark); }
.dc-stat { border-top: 3px solid var(--c) !important; background: linear-gradient(180deg, var(--c-bg), #fff 70%); }
.dc-stat .dc-stat-label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--c-dark); }
.dc-stat .dc-stat-value { font-size: clamp(1.1rem, 4.6vw, 1.45rem); font-weight: 800; color: var(--dc-ink); line-height: 1.2; }
.dc-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .6rem; font-size: .75rem; font-weight: 700; background: var(--c-bg); color: var(--c-dark); border: 1px solid color-mix(in srgb, var(--c) 25%, white); }
.dc-section { display: flex; align-items: center; gap: .6rem; font-weight: 800; font-size: 1.05rem; color: var(--dc-ink); margin: 1.5rem 0 .8rem; }
.dc-section::before { content: ''; width: 5px; height: 1.2em; background: var(--c, var(--dc-brand)); }

/* ---------- Page headings inside business/SMS/admin pages ---------- */
.dc-ui h3.fw-bold, .dc-ui h4.fw-bold:first-child { color: var(--dc-ink); position: relative; padding-left: 14px; }
.dc-ui h3.fw-bold::before { content: ''; position: absolute; left: 0; top: .2em; bottom: .2em; width: 5px; background: var(--dc-grad); }
.dc-ui .text-muted { color: var(--dc-muted) !important; }

/* ---------- Tables ---------- */
.table { --bs-table-hover-bg: #f5f7ff; }
.table thead th, .table > thead > tr > th { background: #f4f6fd; color: #475569; border-bottom: 2px solid #e0e7ff; }
.table thead.bg-light th, .bg-light > tr > th { background: #f4f6fd !important; }
.table tbody tr:hover { background: #fafbff; }

/* ---------- Badges, alerts, pagination, tabs ---------- */
.badge { font-weight: 700; letter-spacing: .01em; }
.badge.bg-info { color: #082f49 !important; background: #7dd3fc !important; }
.badge.bg-warning { color: #451a03 !important; background: #fcd34d !important; }
.badge.bg-secondary { background: #64748b !important; }
.badge.bg-light { border: 1px solid var(--dc-line); }
.alert { border: 0; border-left: 4px solid; }
.alert-success { background: #ecfdf5; color: #065f46; border-color: #10b981; }
.alert-danger { background: #fff1f2; color: #9f1239; border-color: #f43f5e; }
.alert-warning { background: #fffbeb; color: #92400e; border-color: #f59e0b; }
.alert-info { background: #f0f9ff; color: #075985; border-color: #0ea5e9; }
.pagination .page-link { color: var(--dc-brand); border-color: var(--dc-line); font-weight: 600; }
.pagination .page-item.active .page-link { background: var(--dc-grad); border-color: transparent; color: #fff; }
.pagination .page-link:hover { background: #eef2ff; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--dc-grad); color: #fff !important; }
.nav-tabs .nav-link.active { color: var(--dc-brand); border-bottom: 3px solid var(--dc-brand); font-weight: 700; }
.accordion-button:not(.collapsed) { background: #eef2ff; color: var(--dc-brand-dark); box-shadow: none; }
.accordion-button:focus { box-shadow: var(--dc-ring); }
.progress { background: #e0e7ff; }
.progress-bar { background: var(--dc-grad); }
.dropdown-item:active, .dropdown-item.active { background: var(--dc-brand); }
.dropdown-item:hover { background: #eef2ff; color: var(--dc-brand-dark); }
.list-group-item.active { background: var(--dc-brand); border-color: var(--dc-brand); }
.modal-header { border-bottom: 1px solid var(--dc-line); }
.empty-state { color: var(--dc-muted); }
.empty-state i { color: #a5b4fc; opacity: 1 !important; }

/* ---------- Sidebar: one colour per group ---------- */
.app-sidebar .sb-toggle > i:first-child, .app-sidebar a.sb-link > i:first-child { color: var(--g, #64748b); width: 1.3em; }
.app-sidebar [data-g="dashboard"] { --g: #4f46e5; } .app-sidebar [data-g="business"] { --g: #059669; } .app-sidebar [data-g="invitations"] { --g: #7c3aed; }
.app-sidebar [data-g="templates"] { --g: #0284c7; } .app-sidebar [data-g="designing"] { --g: #e11d48; } .app-sidebar [data-g="marketplace"] { --g: #d97706; }
.app-sidebar [data-g="planning"] { --g: #0d9488; } .app-sidebar [data-g="venues"] { --g: #4f46e5; } .app-sidebar [data-g="account"] { --g: #475569; }
.app-sidebar [data-g^="admin"] { --g: #be123c; }
.app-sidebar .sb-sub { border-left: 2px solid #e2e8f0; margin-left: 18px; padding-left: 4px; }
.app-sidebar .sb-link.active { box-shadow: inset 3px 0 0 var(--g, #4f46e5); font-weight: 700; }
.biz-switch select { border-color: #6ee7b7; background: #ecfdf5; font-weight: 600; }

/* ---------- Public marketplace cards ---------- */
.listing-card { border-top: 4px solid var(--c, var(--dc-brand)) !important; transition: transform .18s, box-shadow .18s; }
.listing-card:hover { transform: translateY(-4px); box-shadow: 0 18px 38px rgba(15, 23, 42, .12) !important; }
.listing-card .dc-type { color: var(--c-dark, var(--dc-brand)); font-weight: 800; }
.btn-type { border: 1.5px solid color-mix(in srgb, var(--c) 40%, white); color: var(--c-dark); background: var(--c-bg); }
.btn-type:hover, .btn-type.active { background: var(--c); border-color: var(--c); color: #fff; }

@media (max-width: 575.98px) {
  .btn { padding-top: .5rem; padding-bottom: .5rem; }
  .form-control, .form-select { font-size: 16px; } /* stops iPhones zooming into fields */
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ---------- Availability calendar ---------- */
.dc-cal td { width: 14.28%; padding: .25rem 0; }
.dc-cal-free { background: #ecfdf5; color: #065f46; }
.dc-cal-part { background: #fef3c7; color: #92400e; font-weight: 700; }
.dc-cal-full { background: #fecdd3; color: #9f1239; font-weight: 700; text-decoration: line-through; }
span.dc-cal-free, span.dc-cal-part, span.dc-cal-full { font-size: .72rem; text-decoration: none; }
/* ---------- Stars ---------- */
.dc-stars { color: #f59e0b; letter-spacing: 1px; white-space: nowrap; }
.dc-stars .off { color: #cbd5e1; }

/* ---------- Bootstrap's own blue replaced by the brand colour everywhere (text-primary, bg-primary, links, rings) ---------- */
:root, [data-bs-theme] { --bs-primary: #4f46e5; --bs-primary-rgb: 79, 70, 229; --bs-link-color: #4f46e5; --bs-link-color-rgb: 79, 70, 229; --bs-link-hover-color: #3730a3; --bs-link-hover-color-rgb: 55, 48, 163;
  --bs-success: #059669; --bs-success-rgb: 5, 150, 105; --bs-danger: #e11d48; --bs-danger-rgb: 225, 29, 72; --bs-warning: #d97706; --bs-warning-rgb: 217, 119, 6; --bs-info: #0284c7; --bs-info-rgb: 2, 132, 199; --bs-body-color: #334155; }
.text-primary { color: #4f46e5 !important; }
.bg-primary:not([class*="bg-opacity"]) { background: var(--dc-grad) !important; }
.border-primary { border-color: #6366f1 !important; }
.bg-primary-soft, .badge-primary-soft { background: #eef2ff !important; color: #4338ca !important; }
.text-success { color: #047857 !important; } .text-danger { color: #be123c !important; } .text-warning { color: #b45309 !important; } .text-info { color: #0369a1 !important; }
.bg-info-subtle, .bg-success-subtle, .bg-warning-subtle, .bg-danger-subtle { border: 1px solid rgba(15, 23, 42, .06); }
.dc-hero { background: radial-gradient(circle at 12% 18%, rgba(168, 85, 247, .50), transparent 46%), radial-gradient(circle at 88% 82%, rgba(14, 165, 233, .38), transparent 46%), linear-gradient(135deg, #1e1b4b, #312e81 55%, #4c1d95) !important; }
.dc-hero .text-primary { color: #c4b5fd !important; }

/* Google Translate's top banner pushes the page down and covers the header: the language picker still works without it */
.goog-te-banner-frame, .VIpgJd-ZVi9od-aZ2wEe-wOHMyf, .VIpgJd-ZVi9od-ORHb-OEVmcd, iframe.skiptranslate:not(#goog-gt-tt) { display: none !important; }
body { top: 0 !important; }

/* Tinted panel inside a form: group related fields in a colour (add c-<colour>) */
.dc-panel { background: var(--c-bg, #f1f5f9); border-left: 4px solid var(--c, #475569); padding: 1rem; }
.dc-panel .dc-panel-title { font-weight: 800; font-size: .9rem; color: var(--c-dark, #334155); margin-bottom: .6rem; display: flex; align-items: center; gap: .4rem; }
.dc-panel .form-control, .dc-panel .form-select { background: #fff; }

/* Automatic colour rhythm: cards side by side in a grid get a different accent edge, so a page of cards is not one flat white.
 * Cards that choose their own colour (dc-accent, dc-stat, dc-tile, listing-card) are left alone. */
main .row > [class*="col"]:nth-child(6n+1) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #6366f1; }
main .row > [class*="col"]:nth-child(6n+2) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #10b981; }
main .row > [class*="col"]:nth-child(6n+3) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #f59e0b; }
main .row > [class*="col"]:nth-child(6n+4) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #0ea5e9; }
main .row > [class*="col"]:nth-child(6n+5) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #f43f5e; }
main .row > [class*="col"]:nth-child(6n+6) > .card:not(.dc-accent):not(.dc-stat):not(.dc-tile):not(.listing-card):not(.bg-dark):not([class*="bg-gradient"]) { border-top: 3px solid #8b5cf6; }

/* Language picker (header); Google's own widget stays hidden */
.dc-lang .dropdown-menu { min-width: 170px; }
.dc-lang .btn { background: #eef2ff; color: #3730a3; }
#google_translate_element, .goog-te-gadget, .goog-logo-link, .goog-te-gadget span { display: none !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }

@media (min-width: 768px) { .w-md-auto { width: auto !important; } }

.progress-bar.bg-danger { background: #e11d48 !important; } .progress-bar.bg-success { background: #059669 !important; } .progress-bar.bg-warning { background: #f59e0b !important; } .progress-bar.bg-info { background: #0ea5e9 !important; }
.dc-cal-block { background: #e2e8f0; color: #475569; font-weight: 700; }
span.dc-cal-block { font-size: .72rem; text-decoration: none; }

/* ---------- AI support agent bubble (includes/js/dc-agent.js) ---------- */
#dcAgent { position: fixed; z-index: 2500; left: 16px; bottom: 86px; }                 /* signed-in phone: above the bottom bar */
body:not(.has-sidebar) #dcAgent { bottom: 20px; }                                      /* visitors have no bottom bar */
@media (min-width: 992px) { #dcAgent { left: auto; right: 24px; bottom: 24px; } body:not(.has-sidebar) #dcAgent { bottom: 100px; } }   /* desktop: stacked above the WhatsApp button with a 16px gap */
.dca-fab { width: 58px; height: 58px; border: 0; border-radius: 50%; background: var(--dc-grad); box-shadow: 0 10px 28px rgba(79, 70, 229, .45); font-size: 28px; line-height: 1; position: relative; cursor: pointer; transition: transform .15s; }
.dca-msg.bot.dca-note .dca-bub { background: #fff7e0; color: #7a5b00; font-size: .8rem; font-style: italic; border: 1px dashed #e6c35c; }
.dca-fab:hover { transform: scale(1.06); }
.dca-fab-dot { position: absolute; top: 4px; right: 4px; width: 13px; height: 13px; background: #22c55e; border: 2px solid #fff; border-radius: 50%; }
.dca-fab.open .dca-fab-dot { display: none; }
.dca-panel { position: absolute; left: 0; bottom: 70px; width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100vh - 150px)); background: #fff; border: 1px solid #e2e8f0; box-shadow: 0 24px 60px rgba(15, 23, 42, .28); display: flex; flex-direction: column; }
@media (min-width: 992px) { .dca-panel { left: auto; right: 0; } }
.dca-panel[hidden] { display: none; }
.dca-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--dc-grad); color: #fff; }
.dca-av { width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, .22); display: flex; align-items: center; justify-content: center; font-size: 22px; }
.dca-who { flex: 1; line-height: 1.2; } .dca-who b { display: block; } .dca-who span { font-size: .72rem; opacity: .85; }
.dca-icon { background: rgba(255, 255, 255, .18); border: 0; color: #fff; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; }
.dca-icon:hover { background: rgba(255, 255, 255, .32); }
.dca-log { flex: 1; overflow-y: auto; padding: 14px; background: #f8fafc; display: flex; flex-direction: column; gap: 10px; }
.dca-msg { display: flex; flex-direction: column; max-width: 92%; }
.dca-msg.me { align-self: flex-end; align-items: flex-end; } .dca-msg.bot { align-self: flex-start; }
.dca-bub { padding: 9px 13px; font-size: .9rem; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.dca-msg.bot .dca-bub { background: #fff; border: 1px solid #e2e8f0; color: #1e293b; border-radius: 4px 14px 14px 14px; }
.dca-msg.me .dca-bub { background: var(--dc-grad); color: #fff; border-radius: 14px 4px 14px 14px; }
.dca-typing .dca-bub { color: #64748b; font-style: italic; animation: dcaPulse 1s infinite; }
@keyframes dcaPulse { 50% { opacity: .5; } }
.dca-cards { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.dca-card { display: flex; gap: 10px; background: #fff; border: 1px solid #e2e8f0; border-left: 4px solid var(--dc-brand); text-decoration: none !important; color: #1e293b !important; overflow: hidden; }
.dca-card:hover { background: #eef2ff; }
.dca-card img { width: 72px; height: 72px; object-fit: contain; background: #f1f5f9; flex: none; }
.dca-card-b { padding: 6px 8px; display: flex; flex-direction: column; font-size: .8rem; min-width: 0; } .dca-card-b b { font-size: .86rem; } .dca-card-b span { color: #64748b; } .dca-card-b em { color: #4338ca; font-style: normal; font-weight: 700; } .dca-card-b i { color: #be123c; font-style: normal; font-weight: 700; font-size: .72rem; }
.dca-contacts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; } .dca-contacts a { background: #ecfdf5; color: #065f46 !important; border: 1px solid #6ee7b7; padding: 4px 10px; font-size: .8rem; font-weight: 700; text-decoration: none !important; }
.dca-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px; background: #f8fafc; border-top: 1px solid #e2e8f0; } .dca-chips[hidden] { display: none; }
.dca-chip { border: 1.5px solid #c7d2fe; background: #fff; color: #3730a3; font-size: .78rem; font-weight: 600; padding: 4px 10px; cursor: pointer; } .dca-chip:hover { background: #eef2ff; } .dca-chip-person { border-color: #fda4af; color: #be123c; }
.dca-form { display: flex; gap: 6px; padding: 10px; border-top: 1px solid #e2e8f0; background: #fff; }
.dca-form input { flex: 1; border: 1.5px solid #cbd5e1; padding: 9px 11px; font-size: 16px; min-width: 0; } .dca-form input:focus { outline: 0; border-color: var(--dc-brand); box-shadow: var(--dc-ring); }
.dca-send { border: 0; background: var(--dc-grad); color: #fff; font-weight: 700; padding: 0 16px; cursor: pointer; } .dca-send:disabled { opacity: .5; }
.dca-hint { font-size: .66rem; color: #94a3b8; text-align: center; padding: 0 10px 8px; background: #fff; }
.dca-filling { outline: 3px solid #a5b4fc !important; box-shadow: 0 0 0 6px rgba(99, 102, 241, .18) !important; transition: all .2s; }
.dca-filled { outline: 3px solid #fbbf24 !important; background: #fffbeb !important; animation: dcaFlash 1.4s 2; }
@keyframes dcaFlash { 50% { box-shadow: 0 0 0 8px rgba(251, 191, 36, .35); } }