/* Ghazalah CRM interface polish: typography, spacing and custom menus. */
:root {
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 32px;
    --control-height: 48px;
    --focus-ring: 0 0 0 3px rgba(196, 0, 1, .12);
    --soft-shadow: 0 12px 34px rgba(67, 0, 6, .09);
}

html,
body,
button,
input,
select,
textarea,
option,
optgroup,
table,
th,
td {
    font-family: "Cairo", Arial, sans-serif !important;
}

html {
    line-height: 1.65;
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
}

body {
    overflow-x: hidden;
}

/* The modal uses the native `hidden` attribute while it is closed.
   Keep this rule explicit because `.modal { display: grid; }` in the base
   stylesheet would otherwise override the browser's default hidden style. */
.modal[hidden] {
    display: none !important;
}

body.modal-open {
    overflow: hidden;
}

button,
input,
select,
textarea {
    letter-spacing: 0;
}

input::placeholder,
textarea::placeholder {
    color: #9b8e90;
    opacity: 1;
}

button,
a,
input,
select,
textarea,
.panel,
.stat-card {
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.content {
    padding: var(--space-7);
}

.page-head,
.profile-head {
    margin-bottom: var(--space-6);
}

.page-head {
    min-height: 52px;
}

.page-head h1,
.profile-head h1 {
    line-height: 1.35;
}

.page-head p,
.profile-head p {
    line-height: 1.7;
}

.panel {
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

.panel-head,
.table-tools {
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.dashboard-grid {
    gap: var(--space-6);
}

.stats-grid {
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.stat-card {
    padding: var(--space-5);
}

.list-row {
    min-height: 62px;
    padding: var(--space-3) var(--space-2);
}

.btn {
    min-height: var(--control-height);
    padding: 10px 18px;
    border-radius: 12px;
    line-height: 1.3;
}

.btn:focus-visible,
.icon-btn:focus-visible,
.tabs button:focus-visible,
.sidebar a:focus-visible,
.mobile-nav a:focus-visible {
    outline: 0;
    box-shadow: var(--focus-ring);
}

.filters {
    grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(145px, 1fr)) auto;
    gap: var(--space-3);
    align-items: start;
}

.filters input,
.filters select,
.crm-form input,
.crm-form select,
.crm-form textarea,
.survey-card input,
.survey-card select,
.survey-card textarea,
.login-card input {
    min-height: var(--control-height);
    padding: 10px 14px;
    border-radius: 12px;
}

.crm-form label,
.survey-card label,
.login-card label {
    gap: var(--space-2);
    margin-bottom: var(--space-4);
    line-height: 1.6;
}

.form-grid {
    gap: var(--space-4);
}

.crm-form textarea,
.survey-card textarea {
    min-height: 110px;
    line-height: 1.7;
}

/* Refined native fallback before JavaScript enhances each select. */
select {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    padding-inline-start: 42px !important;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--red) 50%),
        linear-gradient(135deg, var(--red) 50%, transparent 50%);
    background-position:
        18px calc(50% - 2px),
        13px calc(50% - 2px);
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

select:hover {
    border-color: #d9c6c8 !important;
}

/* Custom dropdown: the original select remains in the form, but not visually. */
.custom-select {
    position: relative;
    width: 100%;
    min-width: 0;
}

.custom-select .select-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.custom-select-trigger {
    width: 100%;
    min-height: var(--control-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: 10px 14px;
    color: var(--text);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    text-align: right;
    line-height: 1.5;
}

.custom-select-trigger:hover {
    border-color: #d9c6c8;
}

.custom-select-trigger:focus-visible,
.custom-select.open .custom-select-trigger {
    outline: 0;
    border-color: var(--red);
    box-shadow: var(--focus-ring);
}

.custom-select-trigger > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.custom-select-arrow {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 8px;
    font-size: 11px;
    transition: transform .2s ease, background-color .2s ease;
}

.custom-select.open .custom-select-arrow {
    transform: rotate(180deg);
    background: var(--pink);
}

.custom-select-menu {
    position: absolute;
    z-index: 160;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
    max-height: min(300px, 42vh);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 7px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(67, 0, 6, .16);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px) scale(.985);
    transform-origin: top center;
    pointer-events: none;
    transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
}

.custom-select.drop-up .custom-select-menu {
    top: auto;
    bottom: calc(100% + 8px);
    transform: translateY(6px) scale(.985);
    transform-origin: bottom center;
}

.custom-select.open .custom-select-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.custom-select-option {
    width: 100%;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: 9px 11px;
    color: var(--text);
    background: transparent;
    border: 0;
    border-radius: 9px;
    text-align: right;
    line-height: 1.5;
}

.custom-select-option::after {
    content: "\f00c";
    width: 20px;
    color: var(--red);
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    opacity: 0;
    transform: scale(.7);
    transition: opacity .15s ease, transform .15s ease;
}

.custom-select-option:hover,
.custom-select-option:focus-visible {
    outline: 0;
    color: var(--red);
    background: var(--pale);
}

.custom-select-option.selected {
    color: var(--red);
    background: #fff4f4;
    font-weight: 700;
}

.custom-select-option.selected::after {
    opacity: 1;
    transform: scale(1);
}

.custom-select-option:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.custom-select-menu::-webkit-scrollbar,
.sidebar nav::-webkit-scrollbar,
.tabs::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.custom-select-menu::-webkit-scrollbar-thumb,
.sidebar nav::-webkit-scrollbar-thumb,
.tabs::-webkit-scrollbar-thumb {
    background: #dbc8ca;
    border-radius: 999px;
}

.custom-select-menu {
    scrollbar-width: thin;
    scrollbar-color: #dbc8ca transparent;
}

.password-field {
    overflow: hidden;
}

.login-card,
.survey-card {
    padding: var(--space-7);
}

.login-card > p,
.survey-card > p {
    line-height: 1.75;
}

.radio-chips,
.check-chips {
    gap: var(--space-2);
}

.radio-chips label,
.check-chips label {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 9px 14px;
}

.survey-card fieldset {
    margin-bottom: var(--space-5);
}

.survey-card details {
    padding: var(--space-4);
    margin-bottom: var(--space-5);
}

.modal-card {
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    padding: var(--space-6);
    border: 1px solid var(--border);
    box-shadow: 0 24px 70px rgba(67, 0, 6, .2);
}

th,
td {
    padding: 14px 12px;
}

.actions {
    flex-wrap: wrap;
}

@media (max-width: 1450px) {
    .filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .catalog-row-details { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .content {
        padding: var(--space-5);
        padding-bottom: 90px;
    }

    .panel,
    .dashboard-grid {
        gap: var(--space-5);
    }

    .sidebar {
        box-shadow: -20px 0 50px rgba(67, 0, 6, .12);
    }
}

@media (max-width: 600px) {
    :root {
        --space-7: 24px;
        --control-height: 46px;
    }

    .content {
        padding: var(--space-4);
        padding-bottom: 88px;
    }

    .topbar {
        gap: var(--space-3);
        padding: 10px var(--space-4);
    }

    .page-head,
    .profile-head {
        gap: var(--space-4);
        margin-bottom: var(--space-5);
    }

    .panel {
        padding: var(--space-4);
        margin-bottom: var(--space-4);
        border-radius: 14px;
    }

    .stats-grid {
        gap: var(--space-2);
        margin-bottom: var(--space-4);
    }

    .stat-card {
        padding: var(--space-3);
    }

    .filters {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-3);
    }

    .filters > *,
    .form-grid > *,
    .info-grid > * {
        min-width: 0;
    }

    .table-tools {
        align-items: flex-start;
        flex-direction: column;
    }

    .table-tools > div {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--space-2);
    }

    .responsive-table td {
        align-items: flex-start;
        overflow-wrap: anywhere;
    }

    .login-page,
    .survey-page {
        padding: var(--space-3);
        align-items: start;
    }

    .login-card,
    .survey-card {
        padding: var(--space-5);
        margin-block: var(--space-3);
        border-radius: 18px;
    }

    .custom-select-menu {
        max-height: min(260px, 38vh);
    }

    .modal {
        padding: var(--space-3);
    }

    .modal-card {
        padding: var(--space-5);
        max-height: calc(100vh - 24px);
    }
}

@media (max-width: 380px) {
    .content {
        padding-inline: var(--space-3);
    }

    .topbar {
        padding-inline: var(--space-3);
    }

    .global-search {
        padding-inline: 11px;
    }

    .stats-grid,
    .profile-stats {
        grid-template-columns: minmax(0, 1fr);
    }

    .actions {
        grid-template-columns: 46px minmax(0, 1fr) !important;
    }

    .actions .btn.primary {
        grid-column: 1 / -1;
    }
}

/* Quick entry */
.eyebrow {
    width: max-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.quick-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: var(--space-6);
    align-items: start;
}

.quick-entry-panel {
    padding: 0;
    overflow: hidden;
}

.quick-entry-form {
    display: block;
}

.form-section,
.form-disclosure,
.followup-toggle-card {
    margin: 0;
    padding: 26px 28px;
    border: 0;
    border-bottom: 1px solid var(--border);
}

.form-section.is-primary {
    background: linear-gradient(180deg, #fff 0%, #fffbfb 100%);
}

.section-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
}

.section-heading > span {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--red);
    border-radius: 12px;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(196, 0, 1, .18);
}

.section-heading h2,
.filter-heading h2,
.results-heading h2,
.modal-heading h2 {
    margin: 0;
    font-size: 18px;
    line-height: 1.4;
}

.section-heading p,
.filter-heading p,
.modal-heading p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.quick-essential-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quick-entry-form label b,
.modal-form label b {
    color: var(--red);
}

.optional {
    color: var(--muted);
    font-size: 11px;
    font-weight: 500;
}

.input-icon {
    position: relative;
}

.input-icon > i {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 14px;
    color: #a18d90;
    transform: translateY(-50%);
    pointer-events: none;
}

.input-icon input {
    padding-right: 42px !important;
}

.phone-field .input-icon input {
    text-align: left;
}

.field-message {
    min-height: 21px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
}

.field-message::before {
    content: "\f05a";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
}

.field-message.loading {
    color: #8b5e00;
}

.field-message.new {
    color: var(--green);
}

.field-message.exists {
    color: #7c3aed;
}

.field-message.error {
    color: #991b1b;
}

.inline-choice {
    margin: 2px 0 16px;
    padding: 0;
    border: 0;
}

.inline-choice legend {
    margin-bottom: 9px;
    font-weight: 700;
}

.quick-entry-form .radio-chips label {
    margin: 0;
}

.quick-entry-form .radio-chips span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.existing-customer {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px;
    color: #4c1d95;
    background: #f7f2ff;
    border: 1px solid #e7d9ff;
    border-radius: 13px;
}

.existing-customer[hidden] {
    display: none;
}

.existing-customer .avatar.small {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    font-size: 17px;
}

.existing-customer div {
    min-width: 0;
    display: grid;
}

.existing-customer small {
    color: #76628e;
}

.existing-customer a {
    margin-right: auto;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 800;
}

.visit-choice {
    margin: 0 0 20px;
    padding: 0;
    border: 0;
}

.radio-cards {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 9px;
}

.radio-cards label {
    margin: 0;
}

.radio-cards input {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    opacity: 0;
}

.radio-cards span {
    min-height: 74px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 7px;
    color: var(--muted);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 13px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.radio-cards span i {
    color: var(--red);
    font-size: 18px;
}

.radio-cards label:hover span {
    border-color: #d9c3c5;
    transform: translateY(-1px);
}

.radio-cards input:checked + span {
    color: var(--red);
    background: var(--pale);
    border-color: var(--red);
    box-shadow: var(--focus-ring);
}

.purchase-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wide-field {
    grid-column: 1 / -1;
}

.form-disclosure {
    background: #fff;
}

.form-disclosure > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    list-style: none;
    cursor: pointer;
}

.form-disclosure > summary::-webkit-details-marker {
    display: none;
}

.form-disclosure > summary > span {
    display: grid;
    grid-template-columns: 38px 1fr;
    align-items: center;
    column-gap: 12px;
}

.form-disclosure > summary > span > i {
    grid-row: 1 / 3;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 11px;
}

.form-disclosure summary small {
    color: var(--muted);
    font-weight: 500;
}

.form-disclosure > summary > i {
    color: var(--red);
    transition: transform .2s ease;
}

.form-disclosure[open] > summary > i {
    transform: rotate(180deg);
}

.details-content {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px dashed var(--border);
}

.toggle-line {
    min-height: 48px;
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 10px !important;
    margin: 0 !important;
    cursor: pointer;
}

.toggle-line > input {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    opacity: 0;
}

.toggle-line > span:first-of-type {
    flex: 0 0 44px;
    width: 44px;
    height: 24px;
    position: relative;
    background: #d8cecf;
    border-radius: 999px;
    transition: background-color .2s ease;
}

.toggle-line > span:first-of-type::after {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 7px rgba(33, 25, 26, .22);
    transition: transform .2s ease;
}

.toggle-line > input:checked + span:first-of-type {
    background: var(--red);
}

.toggle-line > input:checked + span:first-of-type::after {
    transform: translateX(-20px);
}

.followup-toggle-card {
    background: #fffafa;
}

.main-toggle {
    flex-wrap: wrap;
}

.main-toggle small {
    flex: 1 0 100%;
    padding-right: 54px;
    color: var(--muted);
    font-weight: 500;
}

.followup-fields {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px dashed #dfcacc;
}

.followup-fields[hidden],
.next-followup-fields[hidden],
#quickWhatsappOther[hidden],
#purchaseAmountField[hidden] {
    display: none !important;
}

.quick-consent {
    min-height: 72px;
    margin: 22px 28px !important;
}

.quick-consent > input {
    position: static;
    width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    opacity: 1;
}

.quick-consent > span {
    display: grid;
}

.quick-consent small {
    color: var(--muted);
    font-weight: 500;
}

.quick-submit-bar {
    position: sticky;
    z-index: 8;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 17px 28px;
    background: rgba(255, 255, 255, .96);
    border-top: 1px solid var(--border);
    box-shadow: 0 -10px 30px rgba(67, 0, 6, .06);
    backdrop-filter: blur(10px);
}

.quick-submit-bar > div:first-child {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--muted);
    font-size: 12px;
}

.quick-submit-bar > div:first-child i {
    color: var(--green);
}

.submit-actions {
    display: flex;
    gap: 9px;
}

.btn.is-loading {
    opacity: .75;
    pointer-events: none;
}

.btn.is-loading i {
    animation: spin .8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.quick-side {
    position: sticky;
    top: 100px;
}

.quick-tip {
    padding: 22px;
}

.quick-tip .tip-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 13px;
}

.quick-tip h3 {
    margin: 14px 0 8px;
    font-size: 16px;
}

.quick-tip p,
.quick-tip li {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.9;
}

.quick-tip ol {
    margin: 0;
    padding-right: 19px;
}

.quick-tip.soft {
    background: #fff9f5;
}

/* Follow-up workspace */
.followup-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 11px;
    margin-bottom: 18px;
}

.followup-stat {
    min-height: 92px;
    display: grid;
    grid-template-columns: 38px 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0 10px;
    padding: 15px;
    color: var(--text);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 15px;
    text-align: right;
    box-shadow: var(--shadow);
}

.followup-stat > i {
    grid-row: 1 / 3;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 11px;
}

.followup-stat span {
    color: var(--muted);
    font-size: 12px;
}

.followup-stat strong {
    font-size: 21px;
}

.followup-stat:hover,
.followup-stat.active {
    border-color: var(--red);
    transform: translateY(-2px);
}

.followup-stat.active {
    color: #fff;
    background: var(--red);
}

.followup-stat.active > i {
    color: #fff;
    background: rgba(255, 255, 255, .16);
}

.followup-stat.active span {
    color: #ffe2e2;
}

.filter-heading,
.results-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.followup-filters {
    grid-template-columns: minmax(250px, 1.7fr) repeat(4, minmax(145px, 1fr));
}

.filter-search {
    position: relative;
    margin: 0 !important;
}

.filter-search > i {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 14px;
    color: var(--muted);
    transform: translateY(-50%);
}

.filter-search input {
    padding-right: 40px;
}

.date-filter {
    position: relative;
    margin: 0 !important;
}

.date-filter span {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 12px;
    color: var(--muted);
    font-size: 11px;
    transform: translateY(-50%);
}

.date-filter input {
    padding-right: 36px;
}

.results-heading {
    padding: 2px 3px;
}

.results-heading > div {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.results-heading > div span,
.results-heading > small {
    color: var(--muted);
    font-size: 12px;
}

.results-heading > small i {
    color: var(--red);
}

.followup-list {
    display: grid;
    gap: 12px;
}

.followup-card {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr) 128px;
    gap: 18px;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: var(--shadow);
}

.followup-card.is-overdue {
    border-right: 4px solid #dc2626;
    background: linear-gradient(90deg, #fff 75%, #fff7f7 100%);
}

.followup-date {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    padding-left: 18px;
    border-left: 1px solid var(--border);
}

.date-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin-bottom: 5px;
    color: var(--red);
    background: var(--pale);
    border-radius: 10px;
}

.followup-date strong {
    font-size: 13px;
}

.followup-date small {
    color: var(--muted);
    font-size: 11px;
}

.is-overdue .followup-date small,
.is-overdue .date-icon {
    color: #b91c1c;
}

.followup-main {
    min-width: 0;
}

.followup-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.followup-title > div:first-child {
    min-width: 0;
    display: grid;
}

.followup-title a {
    width: max-content;
    max-width: 100%;
    font-size: 16px;
    font-weight: 800;
}

.followup-title a:hover {
    color: var(--red);
}

.followup-title small {
    color: var(--muted);
    font-size: 11px;
}

.followup-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.priority {
    display: inline-flex;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.priority-low {
    color: #475569;
    background: #f1f5f9;
}

.priority-normal {
    color: #1d4ed8;
    background: #eff6ff;
}

.priority-high {
    color: #b45309;
    background: #fff7ed;
}

.priority-urgent {
    color: #b91c1c;
    background: #fef2f2;
}

.followup-reason {
    margin-top: 10px;
}

.followup-reason > span {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.followup-reason p {
    margin: 5px 0 0;
    color: #514649;
    line-height: 1.75;
}

.followup-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 15px;
    margin-top: 11px;
    padding-top: 10px;
    color: var(--muted);
    border-top: 1px dashed var(--border);
    font-size: 11px;
}

.followup-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.followup-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    align-content: center;
}

.action-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 9px;
    color: var(--muted);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
}

.action-btn:hover {
    color: var(--red);
    border-color: #d9c3c5;
}

.action-btn.whatsapp {
    color: #087a4d;
    background: #effcf6;
    border-color: #c9efdc;
}

.action-btn.complete {
    grid-column: 1 / -1;
    color: #fff;
    background: var(--red);
    border-color: var(--red);
}

.action-btn.danger {
    color: #b91c1c;
}

.followup-empty {
    padding: 55px 20px;
    color: var(--muted);
    background: #fff;
    border: 1px dashed #d9c8ca;
    border-radius: 16px;
    text-align: center;
}

.followup-empty > span {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    color: var(--red);
    background: var(--pale);
    border-radius: 18px;
    font-size: 24px;
}

.followup-empty h3 {
    margin: 0;
    color: var(--text);
}

.followup-empty p {
    margin: 5px 0 0;
}

.followup-skeleton {
    height: 150px;
    margin-bottom: 12px;
    border-radius: 16px;
    background: linear-gradient(90deg, #f7eeee, #fff, #f7eeee);
    background-size: 200% 100%;
    animation: shimmer 1.2s infinite;
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}

.pagination span {
    color: var(--muted);
    font-size: 12px;
}

.pagination button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.modal-form {
    padding-top: 7px;
}

.modal-card {
    width: min(100%, 680px);
}

.modal-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 22px;
    padding-left: 34px;
}

.modal-heading > span {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 13px;
}

.modal-heading.success > span {
    color: var(--green);
    background: #eaf8f1;
}

.modal-heading.danger > span {
    color: #b91c1c;
    background: #fef2f2;
}

.modal-form .form-grid {
    grid-template-columns: 1fr 1fr;
}

.modal-next-toggle {
    margin-bottom: 14px !important;
}

.next-followup-fields {
    margin-bottom: 14px;
    padding: 14px;
    background: var(--pale);
    border-radius: 12px;
}

.danger-btn {
    color: #fff;
    background: #b91c1c;
    border-color: #b91c1c;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (max-width: 1250px) {
    .quick-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .quick-side {
        position: static;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--space-4);
    }

    .quick-tip {
        margin: 0;
    }

    .radio-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .followup-filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .followup-card {
        grid-template-columns: 155px minmax(0, 1fr);
    }

    .followup-actions {
        grid-column: 1 / -1;
        display: flex;
        justify-content: flex-end;
    }

    .followup-actions .action-btn.complete {
        grid-column: auto;
    }
}

@media (max-width: 900px) {
    .quick-essential-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .followup-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .followup-card {
        grid-template-columns: 1fr;
    }

    .followup-date {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 0 0 12px;
        border: 0;
        border-bottom: 1px solid var(--border);
    }

    .followup-date .date-icon {
        margin: 0;
    }

    .followup-actions {
        grid-column: auto;
    }
}

@media (max-width: 600px) {
    .form-section,
    .form-disclosure,
    .followup-toggle-card {
        padding: 20px 16px;
    }

    .quick-essential-grid,
    .purchase-fields,
    .modal-form .form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .radio-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .existing-customer {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .existing-customer a {
        width: 100%;
        padding-right: 54px;
    }

    .quick-consent {
        margin: 16px !important;
    }

    .quick-submit-bar {
        align-items: stretch;
        flex-direction: column;
        padding: 14px 16px;
    }

    .quick-submit-bar > div:first-child {
        display: none;
    }

    .submit-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .quick-side {
        grid-template-columns: 1fr;
    }

    .followup-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .followup-stat {
        min-height: 82px;
        padding: 12px;
    }

    .followup-filters {
        grid-template-columns: minmax(0, 1fr);
    }

    .filter-heading,
    .results-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .filter-heading .btn {
        width: 100%;
    }

    .results-heading > small {
        display: none;
    }

    .followup-card {
        padding: 14px;
        gap: 13px;
    }

    .followup-title {
        flex-direction: column;
    }

    .followup-badges {
        justify-content: flex-start;
    }

    .followup-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .followup-actions .action-btn.complete {
        grid-column: 1 / -1;
    }

    .action-btn {
        min-height: 44px;
        flex-direction: column;
        gap: 2px;
    }

    .modal-heading {
        align-items: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* v1.2.0 — Fast customer entry, access control and loyalty */
.topbar-spacer {
    flex: 1;
}

.quick-essential-grid.is-fast {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.quick-whatsapp {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin: 4px 0 14px;
}

.quick-whatsapp legend {
    float: right;
    margin-left: 8px;
    font-size: 13px;
    font-weight: 800;
}

.fast-options {
    margin-top: 13px;
    border: 1px dashed #dfcbcd;
    border-radius: 14px;
    background: #fff;
}

.fast-options > summary {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 13px 15px;
    color: var(--red);
    list-style: none;
    cursor: pointer;
    font-weight: 800;
}

.fast-options > summary::-webkit-details-marker {
    display: none;
}

.fast-options > summary small {
    margin-left: auto;
    color: var(--muted);
    font-weight: 500;
}

.fast-options > summary > i:last-child {
    margin-right: auto;
    transition: transform .2s ease;
}

.fast-options[open] > summary > i:last-child {
    transform: rotate(180deg);
}

.fast-options > .form-grid {
    padding: 4px 15px 15px;
}

.permissions-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 18px;
    padding: 16px 18px;
    color: #573d42;
    background: #fff8f8;
    border: 1px solid #efd9dc;
    border-radius: 15px;
}

.permissions-note > i {
    margin-top: 4px;
    color: var(--red);
}

.permissions-note p {
    margin: 3px 0 0;
    color: var(--muted);
    line-height: 1.75;
}

.users-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
}

.user-card {
    padding: 18px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 17px;
    box-shadow: var(--shadow);
}

.user-card.is-disabled {
    background: #fafafa;
    opacity: .74;
}

.user-card-head {
    display: flex;
    align-items: center;
    gap: 11px;
}

.user-avatar,
.loyalty-avatar {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 13px;
    font-size: 18px;
    font-weight: 900;
}

.user-card-head > div {
    min-width: 0;
    display: grid;
}

.user-card-head small,
.user-details,
.user-access span {
    color: var(--muted);
    font-size: 11px;
}

.status-pill {
    margin-right: auto;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
}

.status-pill.active {
    color: #087a4d;
    background: #eaf8f1;
}

.status-pill.inactive {
    color: #991b1b;
    background: #fef2f2;
}

.user-details {
    display: grid;
    gap: 7px;
    margin: 16px 0;
    padding: 13px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.user-details span {
    display: flex;
    align-items: center;
    gap: 7px;
}

.user-details i {
    width: 17px;
    color: var(--red);
    text-align: center;
}

.user-access {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 15px;
}

.user-access strong {
    font-size: 12px;
}

.user-card-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.danger-text {
    color: #b91c1c;
}

.success-text {
    color: #087a4d;
}

.user-form {
    max-height: min(78vh, 780px);
    overflow: auto;
    padding: 4px 4px 4px 8px;
}

.permissions-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 20px 0 10px;
}

.permission-groups {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
}

.permission-group {
    margin: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 13px;
}

.permission-group legend {
    padding: 0 7px;
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.permission-group > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.permission-group label {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 8px 10px;
    background: #fffafa;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
}

.permission-group label:has(input:checked) {
    color: var(--red);
    background: var(--pale);
    border-color: #e5c9cc;
}

.permission-group input {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    min-height: 1px !important;
    opacity: 0;
}

.permission-group label > span {
    flex: 0 0 21px;
    width: 21px;
    height: 21px;
    display: grid;
    place-items: center;
    color: transparent;
    background: #fff;
    border: 1px solid #d7cacc;
    border-radius: 6px;
    font-size: 10px;
}

.permission-group input:checked + span {
    color: #fff;
    background: var(--red);
    border-color: var(--red);
}

.permission-group b {
    font-size: 11px;
    line-height: 1.55;
}

.check-line {
    display: flex !important;
    grid-template-columns: 20px 1fr;
    align-items: center;
    gap: 8px !important;
    margin: 6px 0 14px !important;
}

.check-line input {
    width: 18px !important;
    min-height: 18px !important;
}

.password-input {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--border);
    border-radius: 11px;
    overflow: hidden;
    background: #fff;
}

.password-input:focus-within {
    border-color: var(--red);
    box-shadow: 0 0 0 3px var(--pink);
}

.password-input input {
    min-width: 0;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.password-input button {
    flex: 0 0 46px;
    border: 0;
    color: var(--muted);
    background: transparent;
}

.loyalty-summary {
    display: grid;
    grid-template-columns: 1.35fr repeat(3, 1fr);
    gap: 13px;
    margin-bottom: 18px;
}

.loyalty-summary > article {
    min-height: 144px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 17px;
    box-shadow: var(--shadow);
}

.loyalty-summary > article > i {
    width: 37px;
    height: 37px;
    display: grid;
    place-items: center;
    margin-bottom: 5px;
    color: #a76f00;
    background: #fff8df;
    border-radius: 11px;
}

.loyalty-summary article > span,
.loyalty-summary article > small {
    color: var(--muted);
    font-size: 11px;
}

.loyalty-summary article > strong {
    font-size: 22px;
}

.loyalty-summary .loyalty-hero {
    display: grid;
    grid-template-columns: 62px 1fr;
    color: #fff;
    background: linear-gradient(135deg, #430006, #8f0001);
    border-color: transparent;
}

.loyalty-hero > span {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: #7a4c00 !important;
    background: #ffe6a1;
    border-radius: 17px;
    font-size: 25px !important;
}

.loyalty-hero > div {
    display: grid;
}

.loyalty-hero small,
.loyalty-hero p {
    color: #f7dfe1;
}

.loyalty-hero strong {
    font-size: 31px;
}

.loyalty-hero p {
    margin: 2px 0 0;
    font-size: 11px;
}

.loyalty-filters {
    grid-template-columns: minmax(250px, 2fr) 1fr 1fr;
}

.loyalty-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.loyalty-card {
    padding: 18px;
    background: #fff;
    border: 1px solid #e8d9c0;
    border-radius: 17px;
    box-shadow: var(--shadow);
}

.loyalty-card-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.loyalty-card-head > div {
    min-width: 0;
    display: grid;
}

.loyalty-card-head a {
    font-weight: 900;
}

.loyalty-card-head small {
    color: var(--muted);
    font-size: 10px;
}

.loyalty-card-head > i {
    margin-right: auto;
    color: #b47c0c;
    font-size: 21px;
}

.loyalty-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 16px 0 12px;
}

.loyalty-metrics > div {
    display: grid;
    gap: 2px;
    padding: 11px;
    background: #faf8f5;
    border: 1px solid transparent;
    border-radius: 11px;
}

.loyalty-metrics > div.hit {
    background: #fff9e8;
    border-color: #eedaa4;
}

.loyalty-metrics span,
.loyalty-metrics small {
    color: var(--muted);
    font-size: 9px;
}

.loyalty-metrics strong {
    font-size: 13px;
}

.loyalty-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 27px;
}

.loyalty-tags span {
    padding: 5px 8px;
    color: #855d08;
    background: #fff7da;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
}

.loyalty-actions {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    margin-top: 15px;
    padding-top: 13px;
    border-top: 1px solid var(--border);
}

.loyalty-empty {
    padding: 55px 20px;
    color: var(--muted);
    background: #fff;
    border: 1px dashed #d9c8ca;
    border-radius: 17px;
    text-align: center;
}

.loyalty-empty > i {
    color: #b47c0c;
    font-size: 34px;
}

.loyalty-empty h3 {
    margin: 11px 0 3px;
    color: var(--text);
}

.loyalty-empty p {
    margin: 0;
}

.settings-layout {
    display: grid;
    grid-template-columns: minmax(0, 820px);
}

.settings-card {
    padding: 25px;
}

.settings-card-head {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border);
}

.settings-card-head > span {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #9b6b08;
    background: #fff6d6;
    border-radius: 14px;
    font-size: 20px;
}

.settings-card-head h2 {
    margin: 0;
}

.settings-card-head p {
    margin: 4px 0 0;
    color: var(--muted);
    line-height: 1.7;
}

.rule-preview {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 5px 0 18px;
    padding: 13px;
    color: #5e474b;
    background: var(--pale);
    border-radius: 12px;
    line-height: 1.75;
}

.rule-preview i {
    margin-top: 5px;
    color: var(--red);
}

.danger-outline {
    color: #b91c1c;
    background: #fff;
    border-color: #fecaca;
}

.danger-outline:hover {
    color: #fff;
    background: #b91c1c;
    border-color: #b91c1c;
}

.activity-panel .table-tools small {
    color: var(--muted);
}

.activity-panel td strong {
    font-size: 12px;
}

.danger-form {
    max-width: 540px;
    margin: auto;
}

.password-change-card {
    width: min(100%, 560px);
    margin-inline: auto;
    padding: 27px;
}

@media (max-width: 1250px) {
    .users-grid,
    .loyalty-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .loyalty-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .loyalty-summary .loyalty-hero {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .users-grid,
    .loyalty-grid,
    .loyalty-summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .loyalty-summary .loyalty-hero {
        grid-column: auto;
    }

    .loyalty-filters,
    .permission-group > div {
        grid-template-columns: minmax(0, 1fr);
    }

    .permissions-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .user-card-actions .btn {
        flex: 1;
    }
}

@media (max-width: 600px) {
    .quick-essential-grid.is-fast,
    .fast-options > .form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .quick-whatsapp {
        align-items: flex-start;
        flex-direction: column;
    }

    .fast-options > summary small {
        display: none;
    }

    .loyalty-metrics {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-card,
    .password-change-card {
        padding: 19px 15px;
    }
}

/* v1.3.0 — Customer profile, settings hub and activity log */
.money-input,
.unit-input {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 11px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.money-input:focus-within,
.unit-input:focus-within {
    border-color: var(--red);
    box-shadow: 0 0 0 3px var(--pink);
}

.money-input input,
.unit-input input {
    min-width: 0;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.money-input > span,
.unit-input > span {
    flex: 0 0 auto;
    min-width: 62px;
    display: grid;
    place-items: center;
    padding: 0 13px;
    color: var(--red);
    background: var(--pale);
    border-right: 1px solid var(--border);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.customer-profile-head {
    gap: 24px;
    padding: 20px 22px;
    background:
        radial-gradient(circle at 100% 0, rgba(196, 0, 1, .1), transparent 34%),
        #fff;
    border: 1px solid var(--border);
    border-radius: 19px;
    box-shadow: var(--shadow);
}

.customer-identity {
    min-width: 0;
}

.customer-identity .avatar {
    width: 66px;
    height: 66px;
    border-radius: 19px;
    font-size: 27px;
}

.profile-title-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
}

.profile-title-line h1 {
    font-size: 27px;
}

.customer-identity p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-actions .btn {
    min-height: 46px;
}

.customer-profile-stats {
    margin-top: 15px;
    gap: 14px;
}

.customer-profile-stats > div {
    min-height: 122px;
    gap: 4px;
    padding: 18px;
    box-shadow: 0 7px 24px rgba(67, 0, 6, .045);
}

.customer-profile-stats > div > span {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 700;
}

.customer-profile-stats > div > span i {
    color: var(--red);
}

.customer-profile-stats > div > strong {
    margin-top: 4px;
    font-size: 21px;
    line-height: 1.5;
}

.customer-profile-stats > div > strong > small {
    display: inline;
    color: var(--muted);
    font-size: 11px;
}

.customer-profile-stats > div > small {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.6;
}

.customer-profile-panel {
    padding: 0;
    overflow: hidden;
}

.profile-tabs {
    gap: 2px;
    padding: 9px 12px 0;
    background: #fffafa;
}

.profile-tabs button {
    min-height: 51px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding-inline: 15px;
}

.profile-tabs button i {
    font-size: 12px;
}

.profile-tab-panels {
    min-height: 280px;
}

.profile-tab-panel {
    padding: 24px;
}

.profile-tab-panel[hidden] {
    display: none !important;
}

.profile-tab-panel.active {
    animation: profilePanelIn .22s ease both;
}

@keyframes profilePanelIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: none; }
}

.profile-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 18px;
}

.profile-section-title h2 {
    margin: 0;
    font-size: 19px;
}

.profile-section-title p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.profile-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.profile-info-card {
    min-width: 0;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 15px;
}

.profile-info-card h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 15px;
    color: #4f3338;
    font-size: 14px;
}

.profile-info-card h3 i {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 10px;
}

.profile-info-card dl {
    margin: 0;
}

.profile-info-card dl > div {
    min-height: 39px;
    display: grid;
    grid-template-columns: minmax(110px, .8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid #f1e8e9;
}

.profile-info-card dl > div:last-child {
    border-bottom: 0;
}

.profile-info-card dt {
    color: var(--muted);
    font-size: 11px;
}

.profile-info-card dd {
    min-width: 0;
    margin: 0;
    font-size: 12px;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.consent-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.consent-card.approved {
    border-color: #bae6cf;
    background: #f3fbf7;
}

.consent-card.denied {
    border-color: #f0d6d9;
    background: #fffafa;
}

.consent-card > strong {
    font-size: 15px;
}

.consent-card > p {
    margin: 7px 0 0;
    color: var(--muted);
    line-height: 1.8;
}

.profile-timeline {
    position: relative;
    display: grid;
    gap: 12px;
}

.profile-timeline::before {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    right: 20px;
    width: 1px;
    background: #eadbdd;
}

.timeline-card {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 13px;
}

.timeline-icon {
    z-index: 1;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border: 4px solid #fff;
    border-radius: 50%;
}

.timeline-main {
    min-width: 0;
    padding: 15px 17px;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 14px;
}

.timeline-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.timeline-card-head > div:first-child {
    min-width: 0;
    display: grid;
}

.timeline-card-head strong {
    font-size: 13px;
}

.timeline-card-head small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 10px;
}

.timeline-main > p {
    margin: 11px 0 0;
    color: #60484c;
    line-height: 1.8;
    overflow-wrap: anywhere;
}

.record-status,
.priority-pill,
.source-pill,
.entity-pill {
    display: inline-flex;
    align-items: center;
    width: max-content;
    max-width: 100%;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.record-status.completed,
.record-status.active {
    color: #087a4d;
    background: #eaf8f1;
}

.record-status.pending {
    color: #9b6b08;
    background: #fff6d6;
}

.record-status.cancelled,
.record-status.refunded {
    color: #991b1b;
    background: #fef2f2;
}

.priority-pill {
    color: #5d4d50;
    background: #f1e8e9;
}

.priority-pill.high,
.priority-pill.urgent {
    color: #991b1b;
    background: #fee2e2;
}

.record-pills {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.source-pill,
.entity-pill {
    color: var(--red);
    background: var(--pale);
}

.purchase-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px 18px;
    margin-top: 12px;
    padding-top: 11px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-size: 10px;
}

.purchase-meta b {
    color: var(--text);
}

.purchase-meta .purchase-total {
    margin-right: auto;
    color: var(--red);
    font-size: 12px;
}

.result-box {
    margin-top: 11px;
    padding: 10px 12px;
    color: #245f47;
    background: #ecf9f2;
    border-radius: 10px;
    font-size: 11px;
}

.result-box small {
    display: block;
    margin-top: 4px;
    color: #48705f;
}

.beauty-preferences-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.beauty-preferences-grid article {
    min-width: 0;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    column-gap: 11px;
    padding: 15px;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 14px;
}

.beauty-preferences-grid i {
    grid-row: 1 / 3;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: #fff;
    border-radius: 11px;
}

.beauty-preferences-grid span {
    color: var(--muted);
    font-size: 10px;
}

.beauty-preferences-grid strong {
    margin-top: 3px;
    font-size: 12px;
    overflow-wrap: anywhere;
}

.allergy-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 14px;
    padding: 15px;
    background: #f8f6f6;
    border: 1px solid var(--border);
    border-radius: 14px;
}

.allergy-alert.has-alert {
    color: #8a4d00;
    background: #fff8e6;
    border-color: #f3d18a;
}

.allergy-alert > i {
    margin-top: 4px;
}

.allergy-alert strong {
    font-size: 12px;
}

.allergy-alert p {
    margin: 3px 0 0;
    color: var(--muted);
    line-height: 1.75;
}

.notes-files-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.notes-list,
.files-list {
    display: grid;
    gap: 10px;
}

.notes-list > article,
.files-list > article {
    min-width: 0;
    padding: 14px;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 13px;
}

.notes-list > article.pinned {
    border-color: #e8c577;
    background: #fffbef;
}

.notes-list article > div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.notes-list small,
.files-list small {
    color: var(--muted);
    font-size: 9px;
}

.notes-list p {
    margin: 9px 0;
    line-height: 1.8;
}

.notes-list article > span {
    color: #9b6b08;
    font-size: 9px;
    font-weight: 800;
}

.files-list > article {
    display: flex;
    align-items: center;
    gap: 11px;
}

.files-list > article > i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: #fff;
    border-radius: 10px;
}

.files-list > article > div {
    min-width: 0;
    display: grid;
}

.files-list strong {
    overflow-wrap: anywhere;
}

.profile-empty {
    padding: 42px 20px;
    color: var(--muted);
    text-align: center;
    background: #fffafa;
    border: 1px dashed #decacc;
    border-radius: 14px;
}

.profile-empty.compact {
    padding: 25px 15px;
}

.profile-empty > i,
.profile-not-found > i {
    color: #caa9ad;
    font-size: 30px;
}

.profile-empty h3 {
    margin: 8px 0 2px;
    color: var(--text);
}

.profile-empty p {
    margin: 0;
}

.profile-not-found h2 {
    margin: 12px 0 18px;
}

.profile-activity-table th,
.profile-activity-table td {
    vertical-align: middle;
}

.settings-shortcuts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
}

.settings-shortcut {
    min-width: 0;
    min-height: 176px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 18px;
    align-items: start;
    gap: 14px;
    padding: 22px;
    color: var(--text);
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: var(--shadow);
    text-align: right;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.settings-shortcut:hover {
    transform: translateY(-3px);
    border-color: #d8aeb3;
    box-shadow: 0 15px 35px rgba(67, 0, 6, .1);
}

.settings-shortcut-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 15px;
    font-size: 20px;
}

.settings-shortcut-copy {
    min-width: 0;
    display: grid;
}

.settings-shortcut-copy strong {
    font-size: 16px;
}

.settings-shortcut-copy small {
    min-height: 48px;
    margin: 6px 0 11px;
    color: var(--muted);
    line-height: 1.75;
}

.settings-shortcut-copy b {
    width: max-content;
    max-width: 100%;
    padding: 5px 9px;
    color: var(--red);
    background: #fff6f6;
    border-radius: 8px;
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-shortcut > i:last-child {
    align-self: center;
    color: #c8b4b7;
}

.modal-card.modal-card-wide {
    width: min(100%, 980px);
}

.modal-card.modal-card-settings {
    width: min(100%, 680px);
}

.modal-card.modal-card-danger {
    width: min(100%, 590px);
}

.settings-modal-form {
    padding: 4px;
}

.integration-status-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0;
    padding: 16px;
    color: #991b1b;
    background: #fef2f2;
    border-radius: 13px;
}

.integration-status-card.active {
    color: #087a4d;
    background: #eaf8f1;
}

.integration-status-card > i {
    font-size: 23px;
}

.integration-status-card > div {
    display: grid;
}

.integration-status-card small {
    margin-top: 2px;
    color: var(--muted);
}

.settings-permission-note {
    padding: 13px;
    color: #8a4d00;
    background: #fff8e6;
    border-radius: 11px;
    text-align: center;
}

.activity-panel {
    padding: 0;
    overflow: hidden;
}

.activity-panel .table-tools {
    min-height: 72px;
    margin: 0;
    padding: 15px 20px;
    border-bottom: 1px solid var(--border);
}

.activity-panel .table-tools > div {
    display: grid;
}

.activity-panel .table-tools > div small {
    margin-top: 2px;
}

.activity-limit {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--muted);
    font-size: 10px;
}

.activity-table {
    overflow-x: auto;
}

.activity-table table {
    table-layout: fixed;
    min-width: 820px;
}

.activity-col-action { width: 28%; }
.activity-col-user { width: 20%; }
.activity-col-entity { width: 15%; }
.activity-col-ip { width: 17%; }
.activity-col-date { width: 20%; }

.activity-table th {
    height: 48px;
    padding-inline: 18px;
}

.activity-table td {
    min-width: 0;
    padding: 15px 18px;
}

.activity-table td strong {
    display: block;
    font-size: 12px;
    line-height: 1.6;
}

.activity-table td small {
    margin-top: 3px;
    font-size: 9px;
}

.activity-table code {
    display: inline-flex;
    max-width: 100%;
    padding: 5px 8px;
    color: #563c41;
    background: #f7f1f2;
    border-radius: 7px;
    font-family: Cairo, sans-serif;
    font-size: 10px;
    direction: ltr;
    overflow-wrap: anywhere;
}

.activity-table time {
    color: #574347;
    font-size: 11px;
    white-space: nowrap;
}

.activity-empty {
    margin: 20px;
}

.danger-notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 16px;
    padding: 12px;
    color: #991b1b;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 11px;
    line-height: 1.7;
}

.danger-notice i {
    margin-top: 4px;
}

.delete-confirm-check {
    display: flex !important;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: flex-start;
    gap: 9px !important;
    padding: 12px;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 11px;
    cursor: pointer;
}

.delete-confirm-check input {
    width: 18px !important;
    min-height: 18px !important;
    margin-top: 2px;
}

.form-response {
    min-height: 22px;
    margin: 10px 0 0;
    text-align: center;
    font-size: 11px;
    font-weight: 700;
}

.form-response.loading { color: var(--muted); }
.form-response.success { color: #087a4d; }
.form-response.error { color: #991b1b; }

.user-form {
    padding: 8px 10px 8px 14px;
}

.modal-card-wide .user-form > .form-grid {
    gap: 16px;
}

.modal-card-wide .permission-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 13px;
}

.modal-card-wide .permission-group {
    padding: 14px;
}

@media (max-width: 1100px) {
    .settings-shortcuts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .beauty-preferences-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .customer-profile-head {
        align-items: stretch;
        flex-direction: column;
        padding: 17px;
    }

    .profile-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .customer-profile-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-overview-grid,
    .notes-files-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .profile-tab-panel {
        padding: 18px;
    }

    .profile-tabs {
        padding-inline: 8px;
    }

    .profile-tabs button {
        padding-inline: 12px;
    }

    .settings-shortcuts {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-shortcut {
        min-height: 150px;
    }

    .modal-card-wide .permission-groups {
        grid-template-columns: minmax(0, 1fr);
    }

    .activity-panel .table-tools {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }
}

@media (max-width: 600px) {
    .money-input > span,
    .unit-input > span {
        min-width: 57px;
        padding-inline: 10px;
    }

    .customer-identity {
        align-items: flex-start !important;
    }

    .customer-identity .avatar {
        width: 54px;
        height: 54px;
        border-radius: 15px;
        font-size: 21px;
    }

    .profile-title-line h1 {
        font-size: 21px;
    }

    .profile-actions {
        grid-template-columns: 1fr 1fr;
    }

    .profile-actions .btn:last-child {
        grid-column: 1 / -1;
    }

    .customer-profile-stats {
        gap: 9px;
    }

    .customer-profile-stats > div {
        min-height: 112px;
        padding: 13px;
    }

    .customer-profile-stats > div > strong {
        font-size: 16px;
    }

    .profile-tab-panel {
        padding: 15px;
    }

    .profile-section-title {
        align-items: stretch;
        flex-direction: column;
    }

    .profile-info-card {
        padding: 14px;
    }

    .profile-info-card dl > div {
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 8px;
    }

    .timeline-card {
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 9px;
    }

    .profile-timeline::before {
        right: 16px;
    }

    .timeline-icon {
        width: 34px;
        height: 34px;
        border-width: 3px;
        font-size: 11px;
    }

    .timeline-main {
        padding: 13px;
    }

    .timeline-card-head {
        flex-direction: column;
        gap: 8px;
    }

    .purchase-meta .purchase-total {
        width: 100%;
        margin-right: 0;
    }

    .beauty-preferences-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-shortcut {
        min-height: 0;
        grid-template-columns: 46px minmax(0, 1fr) 14px;
        padding: 17px;
    }

    .settings-shortcut-icon {
        width: 46px;
        height: 46px;
        border-radius: 13px;
        font-size: 17px;
    }

    .settings-shortcut-copy small {
        min-height: 0;
    }

    .modal-card.modal-card-wide,
    .modal-card.modal-card-settings,
    .modal-card.modal-card-danger {
        width: 100%;
    }

    .activity-table {
        overflow: visible;
    }

    .activity-table table {
        min-width: 0;
        table-layout: auto;
    }

    .activity-table tr {
        margin: 12px;
        padding: 11px;
        background: #fffafa;
    }

    .activity-table td {
        align-items: center;
        padding: 8px 4px;
    }

    .activity-table td::before {
        flex: 0 0 100px;
        text-align: right;
    }

    .activity-table td > * {
        min-width: 0;
        text-align: left;
    }

    .activity-table time {
        white-space: normal;
    }
}

/* v1.3.1 — resilient actions, complete customer file and balanced laptop sidebar */
@media (min-width: 901px) {
    .sidebar {
        height: 100dvh;
        padding: 14px 12px 12px;
        overflow: hidden;
    }

    .sidebar .brand {
        flex: 0 0 auto;
        padding: 0 8px 12px;
    }

    .sidebar nav {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        gap: 2px;
        padding: 9px 0;
        overflow: hidden;
    }

    .sidebar nav a {
        flex: 0 1 44px;
        min-height: 39px;
        padding: 8px 12px;
    }

    .sidebar .logout {
        flex: 0 0 auto;
        min-height: 41px;
        margin-top: 3px;
        padding: 8px 12px;
    }
}

@media (min-width: 901px) and (max-height: 780px) {
    .sidebar {
        padding-block: 9px;
    }

    .sidebar .brand {
        padding-bottom: 8px;
    }

    .sidebar .brand img {
        width: 94px;
        height: 38px;
    }

    .sidebar nav {
        padding-block: 5px;
    }

    .sidebar nav a {
        flex-basis: 38px;
        min-height: 34px;
        padding-block: 6px;
        font-size: 13px;
    }

    .sidebar .logout {
        min-height: 36px;
        padding-block: 6px;
        font-size: 13px;
    }
}

.customer-product-insights {
    margin-top: 18px;
    padding: 18px;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 16px;
}

.top-products-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.top-products-grid > article {
    min-width: 0;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 13px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 13px;
}

.product-rank,
.purchased-product-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 11px;
    font-weight: 900;
}

.top-products-grid article > div:nth-child(2),
.product-figures,
.purchased-product-price {
    min-width: 0;
    display: grid;
}

.top-products-grid strong,
.purchase-products strong {
    overflow-wrap: anywhere;
}

.top-products-grid small,
.purchase-products small {
    color: var(--muted);
    font-size: 9px;
}

.product-figures,
.purchased-product-price {
    justify-items: end;
    text-align: left;
    white-space: nowrap;
}

.product-figures b {
    color: var(--red);
    font-size: 11px;
}

.purchase-products {
    display: grid;
    gap: 8px;
    margin-top: 13px;
}

.purchase-products > article {
    min-width: 0;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 11px 12px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 11px;
}

.purchased-product-price b {
    color: var(--red);
    font-size: 11px;
}

.settings-shortcut {
    text-decoration: none;
}

.settings-shortcut:focus-visible {
    outline: 0;
    border-color: var(--red);
    box-shadow: var(--focus-ring);
}

/* v1.3.2 — server-rendered critical modals.
   Hash targets keep settings and activity actions usable even before JS loads. */
.page-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: none;
    place-items: center;
    padding: 24px;
}

.page-modal:target {
    display: grid;
}

.page-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(43, 10, 15, .58);
    backdrop-filter: blur(3px);
}

.page-modal-card {
    position: relative;
    z-index: 1;
    width: min(100%, 680px);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 26px;
    background: #fff;
    border: 1px solid rgba(120, 31, 42, .12);
    border-radius: 20px;
    box-shadow: 0 28px 90px rgba(43, 10, 15, .24);
    animation: page-modal-in .18s ease-out;
}

.page-modal-card.modal-card-danger {
    width: min(100%, 590px);
}

.page-modal-close {
    position: absolute;
    z-index: 2;
    top: 11px;
    left: 14px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--muted);
    background: var(--pale);
    border: 0;
    border-radius: 11px;
    font-size: 27px;
    line-height: 1;
}

.page-modal-close:hover,
.page-modal-close:focus-visible {
    color: #fff;
    background: var(--red);
    outline: 0;
}

@keyframes page-modal-in {
    from { opacity: 0; transform: translateY(10px) scale(.985); }
    to { opacity: 1; transform: none; }
}

@media (max-width: 760px) {
    .top-products-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 500px) {
    .customer-product-insights {
        padding: 13px;
    }

    .top-products-grid > article,
    .purchase-products > article {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .product-rank,
    .purchased-product-icon {
        width: 34px;
        height: 34px;
    }

    .product-figures,
    .purchased-product-price {
        grid-column: 2;
        justify-items: start;
        text-align: right;
    }

    .page-modal {
        padding: 12px;
    }

    .page-modal-card {
        max-height: calc(100vh - 24px);
        padding: 22px 16px 18px;
        border-radius: 17px;
    }
}

/* v2.0.0 — Smart Beauty CRM modules */
.feature-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}
.feature-stats > article,
.campaign-summary > article,
.report-kpis > article {
    min-width: 0;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: var(--shadow);
    display: grid;
    gap: 5px;
}
.feature-stats > article > i {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: var(--red);
    background: var(--pale);
    margin-bottom: 6px;
}
.feature-stats span,
.campaign-summary span,
.report-kpis span { color: var(--muted); font-size: 12px; }
.feature-stats strong,
.campaign-summary strong,
.report-kpis strong { font-size: 21px; line-height: 1.35; overflow-wrap: anywhere; }

.migration-warning,
.privacy-banner,
.integration-status {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 18px 20px;
    margin-bottom: 22px;
    border-radius: 16px;
}
.migration-warning { background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; }
.migration-warning > i { font-size: 25px; }
.migration-warning h2,
.migration-warning p,
.privacy-banner p,
.integration-status h2,
.integration-status p { margin: 0; }
.migration-warning p,
.privacy-banner p,
.integration-status p { opacity: .82; }
.migration-warning code { direction: ltr; display: inline-block; }
.privacy-banner { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
.privacy-banner > i { font-size: 25px; }

.catalog-toolbar { padding: 18px 20px; }
.filter-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 14px; }
.filter-heading h2 { margin: 0; font-size: 18px; }
.filter-heading p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.filter-heading > strong { color: var(--red); white-space: nowrap; }
.product-filters { grid-template-columns: minmax(230px, 2fr) repeat(3, minmax(140px, 1fr)) auto; }
.filter-search { position: relative; margin: 0 !important; }
.filter-search > i { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); color: var(--muted); z-index: 2; }
.filter-search input { padding-right: 42px; }
.product-catalog-list {
    display: grid;
    gap: 12px;
}
.catalog-product-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 112px minmax(0,1fr) auto;
    align-items: stretch;
    gap: 16px;
    padding: 12px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 17px;
    box-shadow: var(--shadow);
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.catalog-product-row:hover {
    transform: translateY(-2px);
    border-color: rgba(196,0,1,.24);
    box-shadow: 0 12px 28px rgba(83,33,42,.09);
}
.catalog-row-image {
    position: relative;
    width: 112px;
    min-height: 112px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fffaf9;
}
.catalog-row-image img {
    width: 100%;
    height: 100%;
    min-height: 110px;
    object-fit: contain;
    padding: 8px;
}
.catalog-image-fallback {
    width: 100%;
    height: 100%;
    min-height: 110px;
    display: grid;
    place-items: center;
    color: var(--pink);
    background: var(--cream);
}
.catalog-image-fallback[hidden] { display: none; }
.catalog-image-fallback i { font-size: 31px; }
.catalog-row-content {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 12px;
}
.catalog-row-heading {
    min-width: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}
.catalog-row-title { min-width: 0; }
.catalog-row-title small {
    display: block;
    margin-bottom: 3px;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.catalog-row-title small span { color: var(--pink); padding: 0 3px; }
.catalog-row-title h3 {
    margin: 0;
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
.catalog-row-heading .stock-dot {
    position: static;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
}
.catalog-row-details {
    display: grid;
    grid-template-columns: minmax(150px,1.15fr) repeat(3,minmax(105px,1fr));
    gap: 8px;
}
.catalog-detail {
    min-width: 0;
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #fff8f8;
}
.catalog-detail span { color: var(--muted); font-size: 11px; }
.catalog-detail strong {
    min-width: 0;
    font-size: 13px;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.catalog-row-price { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; }
.catalog-row-price span { flex-basis: 100%; }
.catalog-row-price strong { color: var(--red); font-size: 16px; }
.catalog-row-price del { color: var(--muted); font-size: 11px; }
.catalog-row-actions {
    min-width: 132px;
    display: grid;
    place-items: center;
    align-content: center;
    padding-right: 14px;
    border-right: 1px solid var(--border);
}
.catalog-row-actions .btn { white-space: nowrap; }
.catalog-no-link { color: var(--muted); font-size: 11px; text-align: center; }
.pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 20px 0; }
.pagination button { min-width: 40px; min-height: 40px; border: 1px solid var(--border); border-radius: 10px; background: #fff; font-weight: 700; }
.pagination button.active { color: #fff; background: var(--red); border-color: var(--red); }

.feature-empty { min-height: 230px; padding: 34px; display: grid; place-items: center; align-content: center; text-align: center; color: var(--muted); background: #fff; border: 1px dashed var(--border); border-radius: 17px; }
.feature-empty.compact { min-height: 115px; padding: 18px; }
.feature-empty > i { font-size: 34px; color: var(--pink); }
.feature-empty h2,
.feature-empty h3,
.feature-empty p { margin: 4px 0; }
.followup-skeleton { min-height: 250px; border-radius: 17px; background: linear-gradient(90deg,#f7eeee,#fff,#f7eeee); background-size: 200% 100%; animation: shimmer 1.2s infinite; }
.followup-skeleton.compact { min-height: 110px; }

.campaign-layout,
.reports-layout,
.integration-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .75fr);
    gap: 20px;
    align-items: start;
}
.campaign-builder-panel,
.campaign-preview-panel { min-width: 0; }
.campaign-preview-panel { position: sticky; top: 96px; }
.campaign-builder .toggle-line { display: flex; grid-template-columns: auto 1fr; align-items: center; gap: 10px; min-height: 47px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; margin-top: 26px; }
.toggle-line input { position: absolute; opacity: 0; pointer-events: none; }
.toggle-line span { width: 40px; height: 23px; padding: 3px; background: #d8ccce; border-radius: 999px; transition: .2s; }
.toggle-line span::after { content: ""; display: block; width: 17px; height: 17px; background: #fff; border-radius: 50%; box-shadow: 0 1px 4px rgba(0,0,0,.2); transition: .2s; }
.toggle-line:has(input:checked) span { background: var(--red); }
.toggle-line:has(input:checked) span::after { transform: translateX(-17px); }
.campaign-preview-list { display: grid; gap: 8px; }
.campaign-preview-list article,
.campaign-recipient-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--cream);
}
.campaign-preview-list article > div { min-width: 0; flex: 1; display: grid; }
.campaign-preview-list article small { color: var(--muted); }
.campaign-preview-list article > span:last-child { font-weight: 700; white-space: nowrap; }
.avatar.small { width: 39px; height: 39px; border-radius: 12px; font-size: 16px; flex: 0 0 auto; }
.campaign-summary { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }
.campaign-message-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.campaign-message-card h2 { margin: 0 0 6px; }
.campaign-message-card p { margin: 0; line-height: 1.9; }
.campaign-status { padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.campaign-status.active { background: #dcfce7; color: #166534; }
.campaign-history { display: grid; gap: 9px; }
.campaign-history > a { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; padding: 13px 14px 17px; border: 1px solid var(--border); border-radius: 13px; }
.campaign-history > a:hover { border-color: var(--pink); background: var(--cream); }
.campaign-history > a > div:first-child { display: grid; }
.campaign-history small { color: var(--muted); }
.campaign-history > a > span { font-weight: 800; }
.mini-progress { position: absolute; bottom: 0; right: 0; left: 0; height: 4px; background: var(--pale); }
.mini-progress i { display: block; height: 100%; background: var(--red); }

.segment-overview { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }
.segment-overview > article { padding: 17px; border: 1px solid var(--border); border-radius: 15px; background: #fff; box-shadow: var(--shadow); display: grid; }
.segment-overview span { color: var(--muted); font-size: 12px; }
.segment-overview strong { font-size: 23px; }
.segment-grid,
.opportunity-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.segment-card { position: relative; display: grid; gap: 10px; min-height: 220px; padding: 18px; border: 1px solid var(--border); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.segment-card:hover { transform: translateY(-3px); border-color: var(--pink); }
.segment-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--red); background: var(--pale); font-size: 20px; }
.segment-card h3 { margin: 0; }
.segment-card p { margin: 0; color: var(--muted); }
.segment-card strong { font-size: 26px; color: var(--dark); }
.segment-card > i:last-child { position: absolute; left: 18px; bottom: 20px; color: var(--red); }
.smart-logic { display: flex; align-items: flex-start; gap: 14px; padding: 17px; margin-top: 20px; background: var(--pale); border-radius: 15px; }
.smart-logic > i { color: var(--red); font-size: 22px; }
.smart-logic h3,
.smart-logic p { margin: 0; }
.smart-logic p { color: var(--muted); }

.report-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }
.bar-chart { display: grid; gap: 14px; }
.bar-chart article { display: grid; grid-template-columns: minmax(90px,150px) minmax(100px,1fr) auto; align-items: center; gap: 10px; }
.bar-chart article > span:first-child { font-weight: 700; }
.bar-chart article > div { height: 10px; background: var(--pale); border-radius: 999px; overflow: hidden; }
.bar-chart article > div i { display: block; height: 100%; background: var(--red); border-radius: inherit; }
.bar-chart article strong { font-size: 12px; }
.source-breakdown { display: grid; gap: 10px; }
.source-breakdown article { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--border); }
.source-breakdown article:last-child { border: 0; }
.opportunity-grid > article { padding: 18px; background: #fff; border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow); display: grid; gap: 8px; }
.opportunity-grid > article > i { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 13px; color: var(--red); background: var(--pale); }
.opportunity-grid h3,
.opportunity-grid p { margin: 0; }
.opportunity-grid p { color: var(--muted); }

.integration-status { background: #fff; border: 1px solid var(--border); box-shadow: var(--shadow); }
.integration-status > span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: #991b1b; background: #fee2e2; font-size: 21px; }
.integration-status.ready > span { color: #166534; background: #dcfce7; }
.integration-status > div { flex: 1; }
.integration-status > strong { padding: 6px 11px; border-radius: 999px; color: #991b1b; background: #fee2e2; }
.integration-status.ready > strong { color: #166534; background: #dcfce7; }
.env-list { direction: ltr; display: grid; gap: 8px; margin-bottom: 18px; }
.env-list code { display: block; padding: 10px 12px; overflow-x: auto; color: var(--dark); background: var(--pale); border: 1px solid var(--border); border-radius: 9px; text-align: left; }
.integration-url-form { padding-top: 16px; border-top: 1px solid var(--border); }
.sync-capabilities { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.sync-capabilities li { display: flex; align-items: center; gap: 10px; }
.sync-capabilities i { color: var(--green); }
.sync-state { display: inline-flex; padding: 5px 9px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.sync-state.success { color: #166534; background: #dcfce7; }
.sync-state.failed { color: #991b1b; background: #fee2e2; }
.sync-state.running { color: #92400e; background: #fef3c7; }

.consent-action-btn { margin-top: 14px; width: 100%; }
.repurchase-grid { grid-template-columns: 1fr 1fr; }

/* Fast in-store / QR form */
.survey-page.survey-v2 {
    align-items: start;
    padding: 24px 16px;
    background:
        radial-gradient(circle at 12% 10%, rgba(196,0,1,.08), transparent 27%),
        radial-gradient(circle at 88% 86%, rgba(120,0,1,.07), transparent 30%),
        linear-gradient(145deg, #fff9f9, #fff);
}
.survey-fast-card { width: min(100%, 780px); padding: 24px; border-radius: 26px; }
.survey-brand { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 15px; border-bottom: 1px solid var(--border); }
.survey-brand img { width: 140px; height: 55px; object-fit: contain; }
.survey-brand > span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; color: var(--red); background: var(--pale); border-radius: 999px; font-size: 12px; font-weight: 800; }
.survey-intro { text-align: center; padding: 18px 0 14px; }
.survey-intro h1 { margin: 0; font-size: 25px; }
.survey-intro p { margin: 4px 0 0; color: var(--muted); }
.survey-essential-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 13px; }
.survey-essential-grid label { margin-bottom: 8px; }
.input-icon { position: relative; }
.input-icon > i { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); color: var(--red); }
.input-icon input { padding-right: 43px; }
.survey-interest { padding: 13px 0 4px !important; }
.survey-interest legend { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.survey-interest legend small { color: var(--muted); font-weight: 500; }
.quick-category-chips { gap: 7px; }
.quick-category-chips label { padding: 8px 12px; font-size: 12px; }
.survey-consent { align-items: flex-start; margin: 9px 0 13px !important; border: 1px solid var(--border); }
.survey-consent > span { display: grid; }
.survey-consent small { color: var(--muted); font-weight: 500; }
.survey-submit { min-height: 52px; font-size: 16px; }
.survey-optional { margin-top: 13px; background: #fff; }
.survey-optional summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; }
.survey-optional summary::-webkit-details-marker { display: none; }
.survey-optional summary span { display: inline-flex; align-items: center; gap: 8px; }
.survey-optional summary small { color: var(--muted); font-weight: 500; }
.survey-optional[open] summary i { transform: rotate(45deg); }
.optional-body { padding-top: 13px; border-top: 1px solid var(--border); }
.survey-thanks > span { width: 74px; height: 74px; display: grid; place-items: center; margin: 0 auto 13px; border-radius: 50%; color: #fff; background: var(--red); }
.survey-thanks i { color: inherit; font-size: 31px; }
.survey-thanks h2 { margin: 0; }
.survey-thanks p { margin: 5px 0 0; color: var(--muted); }

@media (max-width: 1180px) {
    .catalog-product-row { grid-template-columns: 100px minmax(0,1fr); }
    .catalog-row-image { width: 100px; min-height: 100px; }
    .catalog-row-image img,
    .catalog-image-fallback { min-height: 98px; }
    .catalog-row-actions {
        grid-column: 1 / -1;
        min-width: 0;
        display: flex;
        justify-content: flex-end;
        padding: 9px 0 0;
        border-right: 0;
        border-top: 1px solid var(--border);
    }

    .product-filters { grid-template-columns: 1.5fr 1fr 1fr; }
    .product-filters > :nth-last-child(-n+2) { grid-column: auto; }
    .segment-grid,
    .opportunity-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .feature-stats,
    .campaign-summary,
    .report-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .campaign-layout,
    .reports-layout,
    .integration-grid { grid-template-columns: 1fr; }
    .campaign-preview-panel { position: static; }
    .product-filters { grid-template-columns: 1fr 1fr; }
    .segment-overview { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 620px) {
    .catalog-product-list { gap: 9px; }
    .catalog-product-row { grid-template-columns: 82px minmax(0,1fr); gap: 10px; padding: 9px; border-radius: 14px; }
    .catalog-row-image { width: 82px; min-height: 82px; border-radius: 11px; }
    .catalog-row-image img,
    .catalog-image-fallback { min-height: 80px; }
    .catalog-row-image img { padding: 5px; }
    .catalog-row-heading { gap: 7px; }
    .catalog-row-title h3 { font-size: 13px; line-height: 1.55; }
    .catalog-row-title small { font-size: 10px; }
    .catalog-row-heading .stock-dot { min-width: 62px; padding: 4px 7px; font-size: 9px; }
    .catalog-row-details { grid-template-columns: 1fr 1fr; gap: 6px; }
    .catalog-detail { padding: 6px 7px; }
    .catalog-detail span { font-size: 9px; }
    .catalog-detail strong { font-size: 11px; }
    .catalog-row-price strong { font-size: 13px; }
    .catalog-row-actions { justify-content: stretch; }
    .catalog-row-actions .btn { width: 100%; justify-content: center; }
    .feature-stats,
    .campaign-summary,
    .report-kpis,
    .segment-overview,
    .segment-grid,
    .opportunity-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
    .feature-stats > article,
    .campaign-summary > article,
    .report-kpis > article { padding: 13px; }
    .feature-stats strong,
    .campaign-summary strong,
    .report-kpis strong { font-size: 17px; }
    .product-filters { grid-template-columns: 1fr; }
    .segment-card { min-height: 190px; padding: 14px; }
    .segment-card strong { font-size: 21px; }
    .bar-chart article { grid-template-columns: 90px 1fr; }
    .bar-chart article strong { grid-column: 2; }
    .campaign-message-card,
    .privacy-banner,
    .integration-status,
    .migration-warning { align-items: flex-start; flex-direction: column; }
    .integration-status > strong { align-self: flex-start; }
    .repurchase-grid { grid-template-columns: 1fr; }
    .survey-fast-card { padding: 18px 15px; border-radius: 20px; }
    .survey-brand img { width: 115px; }
    .survey-essential-grid { grid-template-columns: 1fr; gap: 0; }
    .survey-interest legend { align-items: flex-start; flex-direction: column; gap: 2px; }
}
@media (max-width: 430px) {
    .catalog-row-details { grid-template-columns: 1fr; }
    .feature-stats,
    .campaign-summary,
    .report-kpis,
    .segment-overview,
    .segment-grid,
    .opportunity-grid { grid-template-columns: 1fr; }
    .survey-brand > span { font-size: 10px; padding: 6px 8px; }
    .quick-category-chips label { flex: 1 1 calc(50% - 7px); text-align: center; }
}

.recipient-list { display: grid; gap: 10px; }
.recipient-list > article {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
}
.recipient-list > article > div:first-child { display: grid; min-width: 0; }
.recipient-list small { color: var(--muted); }
.recipient-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.recipient-status { display: inline-flex; justify-content: center; padding: 5px 9px; border-radius: 999px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.recipient-status.status-pending { color: #92400e; background: #fef3c7; }
.recipient-status.status-opened { color: #1d4ed8; background: #dbeafe; }
.recipient-status.status-sent { color: #166534; background: #dcfce7; }
.recipient-status.status-skipped { color: #6b7280; background: #f3f4f6; }
@media (max-width: 760px) {
    .recipient-list > article { grid-template-columns: minmax(0,1fr) auto; }
    .recipient-actions { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
    .recipient-list > article { grid-template-columns: 1fr; }
    .recipient-status { justify-self: start; }
    .recipient-actions .btn { flex: 1; }
}

.opportunity-grid > a {
    position: relative;
    min-height: 210px;
    padding: 18px;
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: start;
    gap: 13px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: var(--shadow);
}
.opportunity-grid > a:hover { transform: translateY(-3px); border-color: var(--pink); }
.opportunity-grid > a > span { width: 44px; height: 44px; display: grid; place-items: center; color: var(--red); background: var(--pale); border-radius: 13px; }
.opportunity-grid > a h2,
.opportunity-grid > a p { margin: 0; }
.opportunity-grid > a h2 { font-size: 17px; }
.opportunity-grid > a p { margin-top: 5px; color: var(--muted); }
.opportunity-grid > a > strong { color: var(--dark); font-size: 27px; }
.opportunity-grid > a > i:last-child { position: absolute; left: 18px; bottom: 18px; color: var(--red); }
.smart-logic > div { display: flex; align-items: center; gap: 10px; min-width: 210px; }
.smart-logic > div i { color: var(--red); font-size: 22px; }
.smart-logic ol { margin: 0; padding-right: 22px; display: grid; gap: 7px; }
@media (max-width: 620px) {
    .opportunity-grid > a { min-height: 175px; grid-template-columns: auto minmax(0,1fr); }
    .opportunity-grid > a > strong { grid-column: 2; font-size: 21px; }
    .smart-logic { display: grid; }
}

/* v2.0.1 — Store connection form */
.integration-config-panel code,
.integration-help code,
.secure-storage-note code { direction:ltr; unicode-bidi:isolate; font-family:Consolas,Monaco,monospace; font-size:.9em; }
.integration-config-form { margin-top:14px; }
.integration-enable { display:flex!important; grid-template-columns:22px 1fr; align-items:center; gap:12px; padding:14px 15px; border:1px solid var(--border); border-radius:12px; background:var(--pale); }
.integration-enable input { width:20px!important; min-height:20px!important; margin:0; accent-color:var(--red); }
.integration-enable span { display:grid; gap:2px; }
.integration-enable small { color:var(--muted); font-weight:500; }
.integration-host-grid { grid-template-columns:minmax(0,3fr) minmax(120px,1fr); }
.integration-managed-note,
.secure-storage-note { display:flex; align-items:flex-start; gap:10px; padding:12px 14px; border-radius:11px; margin:0 0 14px; line-height:1.75; }
.integration-managed-note { background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; }
.secure-storage-note { background:#f0fdf4; border:1px solid #bbf7d0; color:#166534; }
.integration-managed-note i,
.secure-storage-note i { margin-top:5px; flex:0 0 auto; }
.saved-secret-badge { display:inline-flex; align-items:center; gap:5px; width:max-content; color:#166534; background:#dcfce7; border:1px solid #bbf7d0; border-radius:999px; padding:3px 8px; font-weight:700; }
.integration-help { margin-top:22px; padding-top:18px; border-top:1px solid var(--border); }
.integration-help h3 { margin:0 0 8px; font-size:16px; }
.integration-help p { margin:6px 0; color:var(--muted); line-height:1.8; }
@media (max-width:680px){
 .integration-host-grid,.integration-config-form .form-grid{grid-template-columns:1fr}
}

/* v2.0.2 — Store products list: all synced products in responsive rows with lazy images. */

/* v2.0.3 — reliable manual sync, clearer confirmations and aligned required marks */
.field-label-row {
    display: inline-flex;
    align-items: flex-start;
    gap: 4px;
    width: max-content;
    max-width: 100%;
    min-height: 21px;
    line-height: 1.45;
    white-space: nowrap;
}
.required-star {
    position: relative;
    top: -3px;
    display: inline-block;
    color: var(--red);
    font-size: 13px;
    line-height: 1;
    font-weight: 900;
}
.sync-now-form { margin: 0; flex: 0 0 auto; }
.sync-now-form .btn { min-width: 142px; }
.sync-now-form .btn.is-loading { cursor: wait; opacity: .88; }
.connection-missing-alert,
.app-flash {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px 16px;
    margin: 0 0 18px;
    border: 1px solid #f2c6c8;
    border-radius: 15px;
    background: #fff5f5;
    color: #7f1d1d;
}
.connection-missing-alert > i,
.app-flash > i { flex: 0 0 auto; font-size: 21px; }
.connection-missing-alert > div { flex: 1; min-width: 0; }
.connection-missing-alert strong { display: block; margin-bottom: 2px; color: #681313; }
.connection-missing-alert p { margin: 0; color: #8f4b4d; font-size: 12px; }
.connection-missing-alert .btn { flex: 0 0 auto; }
.app-flash { background: #f7f7f8; border-color: var(--border); color: var(--text); font-weight: 700; }
.app-flash.success { background: #ecfdf3; border-color: #bbf7d0; color: #166534; }
.app-flash.error { background: #fff1f2; border-color: #fecdd3; color: #991b1b; }
.app-flash.warning { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.app-flash.info { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }

@media (max-width: 700px) {
    .page-head .sync-now-form,
    .page-head .sync-now-form .btn { width: 100%; }
    .connection-missing-alert { align-items: flex-start; flex-wrap: wrap; }
    .connection-missing-alert .btn { width: 100%; }
}

/* v2.0.4 — always-visible fresh store connection setup */
.store-connection-setup {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100%;
    min-height: 320px;
    margin: 18px 0 22px;
    scroll-margin-top: 92px;
    border: 1px solid #ead7d8;
    box-shadow: 0 12px 34px rgba(101, 23, 28, .06);
}
.store-connection-head {
    align-items: flex-start;
    gap: 16px;
}
.store-connection-head h2 { margin: 5px 0 2px; }
.connection-file-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    padding: 8px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}
.connection-file-state.writable {
    color: #166534;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
}
.connection-file-state.blocked {
    color: #9a3412;
    background: #fff7ed;
    border: 1px solid #fed7aa;
}
.connection-write-warning {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 0 0 15px;
    padding: 13px 14px;
    color: #9a3412;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 12px;
}
.connection-write-warning > i { margin-top: 5px; }
.connection-write-warning strong { display: block; margin-bottom: 2px; }
.connection-write-warning p { margin: 0; line-height: 1.7; }
.store-connection-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.store-connection-actions .btn.primary { min-width: 260px; }
.always-visible-connection-alert { margin-bottom: 0; }
.integration-information-grid { margin-top: 20px; }
.integration-help.no-top-border { margin-top: 0; padding-top: 0; border-top: 0; }
.integration-stats { margin-top: 18px; }
@media (max-width: 760px) {
    .store-connection-head { display: grid; }
    .connection-file-state { width: max-content; max-width: 100%; }
    .store-connection-actions { display: grid; }
    .store-connection-actions .btn { width: 100%; min-width: 0; }
}

/* v2.0.5 — reliable store sync + server-rendered complete product catalog */
.product-filters { grid-template-columns: minmax(220px, 2fr) repeat(4, minmax(130px, 1fr)) auto; }
.catalog-product-row.is-inactive { opacity: .78; background: #fffdfd; }
.catalog-status-line { margin-top: 5px; }
.product-active-state {
    display: inline-flex;
    align-items: center;
    width: max-content;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
}
.product-active-state.active { color: #166534; background: #dcfce7; }
.product-active-state.inactive { color: #6b7280; background: #f3f4f6; }
@media (max-width: 1180px) {
    .product-filters { grid-template-columns: minmax(210px, 1.5fr) repeat(2, minmax(140px, 1fr)); }
}
@media (max-width: 900px) {
    .product-filters { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
    .product-filters { grid-template-columns: 1fr; }
}

/* v2.0.6 — compact, reliable store products table */
.store-products-page-head { align-items: flex-start; }
.store-products-head-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}
.daily-sync-badge {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 999px;
    color: #166534;
    background: #f0fdf4;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.store-product-stats { position: relative; z-index: 1; }
.store-product-stats > article { min-height: 112px; }
.store-products-results {
    position: relative;
    z-index: 1;
    display: block;
    clear: both;
    width: 100%;
    min-width: 0;
    margin: 0;
}
.store-products-table-card {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 17px;
    box-shadow: var(--shadow);
}
.store-products-table-scroll {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}
.store-products-table {
    width: 100%;
    min-width: 1060px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}
.store-products-table th {
    padding: 13px 14px;
    color: #76696b;
    background: #fff7f7;
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.store-products-table th:nth-child(1) { width: 29%; }
.store-products-table th:nth-child(2) { width: 16%; }
.store-products-table th:nth-child(3) { width: 13%; }
.store-products-table th:nth-child(4) { width: 12%; }
.store-products-table th:nth-child(5) { width: 12%; }
.store-products-table th:nth-child(6) { width: 14%; }
.store-products-table th:nth-child(7) { width: 58px; }
.store-products-table td {
    height: 92px;
    padding: 11px 14px;
    vertical-align: middle;
    background: #fff;
    border-bottom: 1px solid var(--border);
    overflow: hidden;
}
.store-products-table tbody tr:last-child td { border-bottom: 0; }
.store-products-table tbody tr:hover td { background: #fffafa; }
.store-product-table-row.is-archived td { background: #fcfcfc; opacity: .82; }
.store-product-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}
.store-product-thumb {
    position: relative;
    flex: 0 0 66px;
    width: 66px;
    height: 66px;
    overflow: hidden;
    display: grid;
    place-items: center;
    background: #fff9f9;
    border: 1px solid var(--border);
    border-radius: 12px;
}
.store-product-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 4px;
    object-fit: contain;
}
.store-product-thumb-fallback {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    color: var(--pink);
    background: var(--cream);
}
.store-product-thumb-fallback[hidden] { display: none; }
.store-product-name {
    min-width: 0;
    display: grid;
    justify-items: start;
    gap: 6px;
}
.store-product-name > strong {
    max-width: 100%;
    color: var(--dark);
    font-size: 14px;
    line-height: 1.65;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.store-product-taxonomy {
    min-width: 0;
    display: grid;
    gap: 4px;
}
.store-product-taxonomy strong,
.store-product-taxonomy span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.store-product-taxonomy strong { font-size: 12px; }
.store-product-taxonomy span { color: var(--muted); font-size: 11px; }
.store-product-price {
    display: grid;
    justify-items: start;
    gap: 3px;
}
.store-product-price strong { color: var(--red); font-size: 15px; white-space: nowrap; }
.store-product-price del { color: var(--muted); font-size: 10px; white-space: nowrap; }
.availability-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 96px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.availability-pill.available { color: #166534; background: #dcfce7; }
.availability-pill.unavailable { color: #991b1b; background: #fee2e2; }
.store-product-sku {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: var(--dark);
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.store-product-sync-time {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}
.store-product-action-cell { text-align: center; }
.store-product-open {
    margin: auto;
    color: var(--red);
    background: #fff7f7;
}
.store-product-open:hover { color: #fff; background: var(--red); border-color: var(--red); }
.store-product-no-link { color: #b7aaac; }
.store-products-empty { margin: 0; }

@media (max-width: 1050px) {
    .store-products-page-head,
    .store-products-head-actions { align-items: stretch; }
    .store-products-head-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .daily-sync-badge { justify-content: center; }
    .store-products-head-actions .sync-now-form,
    .store-products-head-actions .sync-now-form .btn { width: 100%; }
}

@media (max-width: 760px) {
    .store-products-head-actions { grid-template-columns: 1fr; }
    .store-products-table-card { overflow: visible; border: 0; box-shadow: none; background: transparent; }
    .store-products-table-scroll { overflow: visible; }
    .store-products-table,
    .store-products-table thead,
    .store-products-table tbody { display: block; min-width: 0; }
    .store-products-table thead { display: none; }
    .store-products-table tr {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        margin-bottom: 10px;
        overflow: hidden;
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 15px;
        box-shadow: var(--shadow);
    }
    .store-products-table td {
        display: grid;
        align-content: center;
        min-width: 0;
        height: auto;
        min-height: 58px;
        padding: 10px 12px;
        border-bottom: 1px solid var(--border);
        background: transparent;
    }
    .store-products-table td::before {
        content: attr(data-label);
        margin-bottom: 4px;
        color: var(--muted);
        font-size: 9px;
        font-weight: 700;
    }
    .store-products-table .store-product-main-cell {
        grid-column: 1 / -1;
        min-height: 92px;
    }
    .store-products-table .store-product-main-cell::before { display: none; }
    .store-products-table .store-product-action-cell { grid-column: 1 / -1; border-bottom: 0; }
    .store-product-action-cell::before { display: none; }
    .store-product-open { width: 100%; min-height: 40px; border-radius: 10px; }
    .store-product-thumb { flex-basis: 72px; width: 72px; height: 72px; }
}

@media (max-width: 430px) {
    .store-products-table tr { grid-template-columns: 1fr; }
    .store-products-table .store-product-main-cell,
    .store-products-table .store-product-action-cell { grid-column: 1; }
}

/* v2.0.7 — reliable products, settings, users and activity screens */
.store-product-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    width: 100%;
    min-width: 0;
}
.store-product-row {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-width: 0;
    min-height: 126px;
    display: grid;
    grid-template-columns: 34px 92px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 15px 16px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 17px;
    box-shadow: 0 8px 24px rgba(67, 0, 6, .055);
}
.store-product-row::before {
    content: "";
    position: absolute;
    inset-block: 0;
    right: 0;
    width: 4px;
    background: var(--red);
}
.store-product-row:hover {
    transform: translateY(-1px);
    border-color: #e2c7ca;
    box-shadow: 0 14px 34px rgba(67, 0, 6, .09);
}
.store-product-row.is-archived {
    opacity: .76;
    background: #fbfbfb;
}
.store-product-row-number {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    color: #7a6669;
    background: #fff7f7;
    border: 1px solid var(--border);
    border-radius: 9px;
    font-size: 11px;
    font-weight: 800;
}
.store-product-row-image {
    position: relative;
    width: 88px;
    height: 88px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #fffafa;
    border: 1px solid var(--border);
    border-radius: 14px;
}
.store-product-row-image img {
    width: 100%;
    height: 100%;
    display: block;
    padding: 5px;
    object-fit: contain;
}
.store-product-row-image-fallback {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--red);
    background: #fff7f7;
    font-size: 22px;
}
.store-product-row-image-fallback[hidden] { display: none; }
.store-product-row-main {
    min-width: 0;
    display: grid;
    gap: 14px;
}
.store-product-row-title {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.store-product-row-title > div { min-width: 0; }
.store-product-row-title h3 {
    margin: 0;
    color: var(--dark);
    font-size: 15px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}
.store-product-row-title p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 11px;
}
.store-product-row-title p span { margin-inline: 4px; color: #c9b8ba; }
.store-product-row-meta {
    display: grid;
    grid-template-columns: minmax(115px, .9fr) minmax(115px, .85fr) minmax(110px, .8fr) minmax(150px, 1.1fr);
    gap: 10px;
}
.store-product-row-meta > div {
    min-width: 0;
    min-height: 62px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 9px 11px;
    background: #fffafa;
    border: 1px solid #f1e4e6;
    border-radius: 11px;
}
.store-product-row-meta > div > span:first-child {
    color: var(--muted);
    font-size: 9px;
    font-weight: 700;
}
.store-product-row-price strong { color: var(--red); font-size: 14px; white-space: nowrap; }
.store-product-row-price del { color: var(--muted); font-size: 9px; white-space: nowrap; }
.store-product-row-meta .availability-pill {
    width: max-content;
    min-width: 88px;
    padding: 5px 8px;
    font-size: 10px;
}
.store-product-row-action {
    min-width: 126px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.store-product-row-action .btn { width: 100%; white-space: nowrap; }
.store-product-no-link { color: var(--muted); font-size: 11px; }

.users-summary-v207 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.users-summary-v207 article {
    min-width: 0;
    min-height: 105px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 4px 11px;
    padding: 15px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 15px;
    box-shadow: var(--shadow);
}
.users-summary-v207 i {
    grid-row: 1 / 3;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 12px;
}
.users-summary-v207 span { color: var(--muted); font-size: 10px; }
.users-summary-v207 strong { font-size: 20px; }
.users-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.user-card { min-width: 0; padding: 20px; }
.user-card-actions { margin-top: auto; }
.modal { overflow: hidden; }
.modal-card.modal-card-wide {
    width: min(1040px, calc(100vw - 34px));
    max-height: calc(100vh - 34px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.modal-card-wide .user-form {
    max-height: none !important;
    overflow: visible !important;
    padding: 4px !important;
}
.modal-card-wide .user-form-submit {
    position: sticky;
    bottom: -1px;
    z-index: 8;
    box-shadow: 0 -10px 20px #fff;
}
.modal-card-wide .permission-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.modal-card-wide .permission-group > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.activity-panel-v207 { padding: 0; overflow: hidden; }
.activity-toolbar-v207 {
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 15px 20px;
    background: #fffafa;
    border-bottom: 1px solid var(--border);
}
.activity-toolbar-v207 > div { display: grid; gap: 2px; }
.activity-toolbar-v207 small,
.activity-toolbar-v207 > span { color: var(--muted); font-size: 10px; }
.activity-toolbar-v207 > span { display: inline-flex; align-items: center; gap: 6px; }
.activity-feed {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
}
.activity-entry {
    min-width: 0;
    display: grid;
    grid-template-columns: 34px 42px minmax(190px, 1fr) minmax(330px, auto);
    align-items: center;
    gap: 12px;
    padding: 13px 18px;
    background: #fff;
    border-bottom: 1px solid var(--border);
}
.activity-entry:last-child { border-bottom: 0; }
.activity-entry:hover { background: #fffafa; }
.activity-entry-index {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: var(--muted);
    background: #faf6f6;
    border-radius: 8px;
    font-size: 9px;
    font-weight: 800;
}
.activity-entry-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    color: var(--red);
    background: var(--pale);
    border-radius: 11px;
}
.activity-entry-main { min-width: 0; display: grid; gap: 2px; }
.activity-entry-main strong { font-size: 12px; line-height: 1.6; }
.activity-entry-main small { color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.activity-entry-meta {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(90px, auto) minmax(105px, auto) minmax(150px, auto);
    align-items: center;
    justify-content: end;
    gap: 9px;
}
.activity-entry-meta code {
    max-width: 150px;
    padding: 5px 8px;
    overflow: hidden;
    color: #563c41;
    background: #f7f1f2;
    border-radius: 7px;
    font-family: Cairo, sans-serif;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.activity-entry-meta time { color: #574347; font-size: 10px; white-space: nowrap; }

@media (max-width: 1180px) {
    .store-product-row { grid-template-columns: 30px 84px minmax(0, 1fr); }
    .store-product-row-action { grid-column: 3; min-width: 0; justify-content: flex-start; }
    .store-product-row-action .btn { width: auto; }
    .store-product-row-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .users-summary-v207 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .activity-entry { grid-template-columns: 32px 40px minmax(170px, 1fr); }
    .activity-entry-meta { grid-column: 3; justify-content: start; grid-template-columns: repeat(3, max-content); }
}
@media (max-width: 760px) {
    .store-product-row {
        grid-template-columns: 28px 74px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
        border-radius: 15px;
    }
    .store-product-row-image { width: 72px; height: 72px; }
    .store-product-row-title { flex-direction: column; gap: 7px; }
    .store-product-row-meta { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .store-product-row-action { grid-column: 1 / -1; }
    .store-product-row-action .btn { width: 100%; }
    .users-grid { grid-template-columns: minmax(0, 1fr); }
    .modal-card.modal-card-wide { width: calc(100vw - 20px); max-height: calc(100vh - 20px); }
    .modal-card-wide .permission-groups,
    .modal-card-wide .permission-group > div { grid-template-columns: minmax(0, 1fr); }
    .activity-toolbar-v207 { align-items: flex-start; flex-direction: column; }
    .activity-entry { grid-template-columns: 30px 38px minmax(0, 1fr); padding: 12px; gap: 9px; }
    .activity-entry-meta { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; padding-right: 77px; }
    .activity-entry-meta time { grid-column: 1 / -1; }
    .activity-entry-meta code { max-width: 100%; }
}
@media (max-width: 480px) {
    .store-product-row { grid-template-columns: 68px minmax(0, 1fr); }
    .store-product-row-number { position: absolute; top: 8px; right: 8px; z-index: 2; }
    .store-product-row-image { width: 66px; height: 66px; }
    .store-product-row-meta { grid-template-columns: minmax(0, 1fr); }
    .users-summary-v207 { grid-template-columns: minmax(0, 1fr); }
    .activity-entry { grid-template-columns: 36px minmax(0, 1fr); }
    .activity-entry-index { display: none; }
    .activity-entry-meta { padding-right: 45px; grid-template-columns: minmax(0, 1fr); }
    .activity-entry-meta time { grid-column: auto; }
}

/* v2.0.8 — customer file redesign */
.customer-file-page{display:grid;gap:16px;min-width:0}.customer-file-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(520px,.9fr);gap:22px;padding:22px;background:linear-gradient(135deg,#fff 0%,#fffafa 55%,#fff2f3 100%);border:1px solid var(--border);border-radius:22px;box-shadow:0 16px 42px rgba(67,0,6,.07);overflow:hidden}.customer-file-identity{min-width:0}.customer-back-link{display:inline-flex;align-items:center;gap:7px;margin-bottom:14px;color:var(--muted);font-size:12px;font-weight:800}.customer-back-link:hover{color:var(--red)}.customer-identity-row{display:flex;align-items:center;gap:16px;min-width:0}.customer-avatar-large{position:relative;flex:0 0 auto;width:82px;height:82px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--red),var(--dark));border:5px solid #fff;border-radius:25px;box-shadow:0 12px 28px rgba(120,0,1,.22);font-size:31px;font-weight:900}.customer-avatar-large>i{position:absolute;left:-7px;top:-8px;width:28px;height:28px;display:grid;place-items:center;color:#8a5700;background:#ffe8a3;border:3px solid #fff;border-radius:50%;font-size:12px}.customer-name-block{min-width:0}.customer-name-line{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.customer-name-line h1{margin:0;font-size:29px;line-height:1.4}.customer-meta-line,.customer-flags{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px}.customer-meta-line span{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:11px}.customer-meta-line i{color:var(--red)}.customer-flag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f5eeee;color:#62474c;font-size:10px;font-weight:900}.customer-flag.vip{color:#805300;background:#fff1bd}.customer-flag.consented{color:#087a4d;background:#e6f8ef}.customer-flag.blocked{color:#991b1b;background:#feecec}.customer-flag.tag{color:var(--tag-color);background:color-mix(in srgb,var(--tag-color) 10%,white);border:1px solid color-mix(in srgb,var(--tag-color) 22%,white)}.customer-file-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:10px}.profile-action-card{min-width:0;min-height:72px;display:flex;align-items:center;gap:11px;padding:12px 14px;background:#fff;border:1px solid var(--border);border-radius:15px;transition:.2s ease}.profile-action-card:hover{transform:translateY(-2px);border-color:var(--pink);box-shadow:0 10px 24px rgba(67,0,6,.08)}.profile-action-card>i{flex:0 0 auto;width:40px;height:40px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:12px}.profile-action-card.whatsapp>i{color:#087a4d;background:#e8f8f0}.profile-action-card>span{min-width:0;display:grid}.profile-action-card b{font-size:12px}.profile-action-card small{color:var(--muted);font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}.customer-kpi-grid article{min-width:0;min-height:110px;display:flex;align-items:flex-start;gap:11px;padding:15px;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 24px rgba(67,0,6,.035)}.customer-kpi-grid article.alert{border-color:#f1b8bd;background:#fff7f7}.kpi-icon{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:11px}.customer-kpi-grid article>div{min-width:0;display:grid;gap:2px}.customer-kpi-grid small{color:var(--muted);font-size:9px;font-weight:800}.customer-kpi-grid strong{font-size:19px;line-height:1.55;overflow-wrap:anywhere}.customer-kpi-grid strong b{font-size:9px;color:var(--muted)}.customer-kpi-grid .date-value{font-size:12px;min-height:32px;display:flex;align-items:center}.customer-kpi-grid em{color:#8c777a;font-size:8px;font-style:normal}.customer-file-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:start;gap:16px;min-width:0}.customer-file-main{min-width:0;padding:0;overflow:hidden}.customer-file-sidebar{position:sticky;top:94px;display:grid;gap:12px;min-width:0}.profile-side-card{padding:16px;background:#fff;border:1px solid var(--border);border-radius:17px;box-shadow:0 8px 24px rgba(67,0,6,.04)}.side-card-title{display:flex;align-items:center;gap:10px;margin-bottom:13px}.side-card-title>span{width:38px;height:38px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:11px}.side-card-title h2,.side-card-title p{margin:0}.side-card-title h2{font-size:13px}.side-card-title p{color:var(--muted);font-size:9px}.customer-contact-card dl{margin:0}.customer-contact-card dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f2eaeb}.customer-contact-card dl>div:last-child{border:0}.customer-contact-card dt{color:var(--muted);font-size:9px}.customer-contact-card dd{min-width:0;margin:0;font-size:10px;font-weight:900;overflow-wrap:anywhere}.loyalty-progress-card{display:grid;gap:12px}.loyalty-progress-row{display:grid;gap:6px}.loyalty-progress-row header{display:flex;justify-content:space-between;gap:8px;font-size:9px}.loyalty-progress-row header b{color:var(--muted);font-size:8px}.loyalty-progress-row>div{height:8px;background:#f1e6e7;border-radius:999px;overflow:hidden}.loyalty-progress-row>div i{display:block;height:100%;background:linear-gradient(90deg,var(--red),#e65859);border-radius:inherit}.consent-summary.approved{border-color:#b9e4cc;background:#f5fcf8}.consent-summary.denied{border-color:#efd6d9;background:#fffafa}.consent-state{display:flex;align-items:center;gap:8px;margin-bottom:8px}.consent-summary.approved .consent-state{color:#087a4d}.consent-summary.denied .consent-state{color:#991b1b}.consent-summary>small{display:block;margin-bottom:11px;color:var(--muted);font-size:8px}.customer-file-tabs{padding:9px 10px 0;overflow:auto}.customer-file-tabs button{gap:6px}.customer-file-tabs button>b{min-width:21px;height:21px;display:inline-grid;place-items:center;padding:0 6px;color:#7a6266;background:#f1e7e8;border-radius:999px;font-size:8px}.customer-file-tabs button.active>b{color:#fff;background:var(--red)}.customer-file-panels .profile-tab-panel{padding:20px}.customer-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.customer-overview-column{min-width:0;display:grid;align-content:start;gap:15px}.profile-content-section{min-width:0;padding:17px;background:#fff;border:1px solid var(--border);border-radius:16px}.next-best-action{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:13px;padding:17px;background:#fff7f7;border:1px solid #efcdd0;border-radius:17px}.next-best-action>span{width:46px;height:46px;display:grid;place-items:center;color:var(--red);background:#fff;border-radius:14px}.next-best-action small{color:var(--red);font-size:9px;font-weight:900}.next-best-action h2{margin:2px 0;font-size:15px}.next-best-action p{margin:0;color:var(--muted);font-size:10px;line-height:1.7}.next-best-action.danger{border-color:#efb1b7;background:#fff1f2}.next-best-action.warning{border-color:#f0d28e;background:#fffaf0}.next-best-action.success{border-color:#b8e0ca;background:#f4fcf7}.next-best-action.muted{background:#f7f5f5}.compact-activity-feed,.customer-top-products,.purchase-history-list,.customer-record-list,.customer-activity-feed{display:grid;gap:9px}.compact-activity-feed article{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f1e8e9}.compact-activity-feed article:last-child{border:0}.event-icon{width:38px;height:38px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:11px}.event-icon.purchase{color:#087a4d;background:#eaf8f1}.event-icon.followup{color:#8a5c00;background:#fff4d2}.compact-activity-feed article>div{min-width:0;display:grid}.compact-activity-feed strong{font-size:10px}.compact-activity-feed p{margin:2px 0 0;color:var(--muted);font-size:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compact-activity-feed time{color:var(--muted);font-size:8px;white-space:nowrap}.customer-top-products article{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;background:#fffafa;border:1px solid var(--border);border-radius:12px}.customer-top-products .product-rank{width:30px;height:30px;display:grid;place-items:center;color:var(--red);background:#fff;border-radius:9px;font-size:10px;font-weight:900}.customer-top-products article>div{min-width:0;display:grid}.customer-top-products article>div:last-child{text-align:left}.customer-top-products strong,.customer-top-products b{font-size:10px}.customer-top-products small{color:var(--muted);font-size:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.interest-chip-list,.top-brand-strip>div{display:flex;flex-wrap:wrap;gap:7px}.interest-chip-list>span,.top-brand-strip span{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;color:#6a4f54;background:#fffafa;border:1px solid var(--border);border-radius:999px;font-size:9px;font-weight:800}.interest-chip-list>span i,.top-brand-strip span i{color:var(--red)}.interest-chip-list>span b,.top-brand-strip span b{min-width:18px;height:18px;display:grid;place-items:center;color:#fff;background:var(--red);border-radius:50%;font-size:7px}.interest-chip-list .empty-chip{color:var(--muted);border-style:dashed}.purchase-history-card{overflow:hidden;background:#fff;border:1px solid var(--border);border-radius:17px}.purchase-history-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:15px 17px;background:#fffafa;border-bottom:1px solid var(--border)}.purchase-history-card h3{margin:3px 0;font-size:18px;color:var(--red)}.purchase-history-card header small{color:var(--muted);font-size:9px}.purchase-number{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:900}.purchase-product-list{display:grid;padding:5px 17px}.purchase-product-list article{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid #f2eaeb}.purchase-product-list article:last-child{border:0}.purchase-product-list article>span{width:36px;height:36px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:10px}.purchase-product-list article>div{min-width:0;display:grid}.purchase-product-list article>div:last-child{text-align:left}.purchase-product-list strong,.purchase-product-list b{font-size:10px}.purchase-product-list small{color:var(--muted);font-size:8px}.purchase-no-items{display:flex;align-items:center;gap:8px;padding:16px;color:var(--muted);font-size:10px}.purchase-history-card>footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px 17px;padding:11px 17px;background:#fffafa;border-top:1px solid var(--border);color:var(--muted);font-size:8px}.purchase-history-card>footer b{color:var(--text)}.purchase-history-card>footer .total{margin-right:auto;color:var(--red);font-size:10px}.customer-record-list>article{display:grid;grid-template-columns:43px minmax(0,1fr);gap:12px;padding:14px;background:#fffafa;border:1px solid var(--border);border-radius:15px}.customer-record-list>article.overdue{border-color:#efb0b6;background:#fff4f4}.record-icon{width:43px;height:43px;display:grid;place-items:center;color:var(--red);background:#fff;border-radius:12px}.customer-record-list article>div{min-width:0}.customer-record-list header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.customer-record-list header strong{font-size:11px}.customer-record-list header time,.customer-record-list>article>div>time{color:var(--muted);font-size:8px}.customer-record-list p{margin:8px 0;color:#60484c;font-size:10px;line-height:1.8}.customer-record-list>article>div>small{color:var(--muted);font-size:8px}.beauty-profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.beauty-profile-grid article{min-width:0;display:flex;align-items:center;gap:10px;padding:14px;background:#fffafa;border:1px solid var(--border);border-radius:14px}.beauty-profile-grid article>span{flex:0 0 auto;width:39px;height:39px;display:grid;place-items:center;color:var(--red);background:#fff;border-radius:11px}.beauty-profile-grid article>div{min-width:0;display:grid}.beauty-profile-grid small{color:var(--muted);font-size:8px}.beauty-profile-grid strong{font-size:10px;overflow-wrap:anywhere}.inferred-interests-panel{display:grid;grid-template-columns:210px minmax(0,1fr);gap:18px;margin-top:15px;padding:17px;background:#fff;border:1px solid var(--border);border-radius:16px}.inferred-interests-panel h3,.inferred-interests-panel p,.top-brand-strip h3{margin:0}.inferred-interests-panel h3,.top-brand-strip h3{font-size:12px}.inferred-interests-panel p{margin-top:3px;color:var(--muted);font-size:9px}.interest-bars{display:grid;gap:9px}.interest-bars article{display:grid;grid-template-columns:120px minmax(80px,1fr) 24px;align-items:center;gap:9px;font-size:9px}.interest-bars article>div{height:7px;background:#f2e8e9;border-radius:999px;overflow:hidden}.interest-bars article>div i{display:block;height:100%;background:var(--red);border-radius:inherit}.interest-bars article b{color:var(--muted);font-size:8px}.top-brand-strip{margin-top:15px;padding:16px;background:#fffafa;border:1px solid var(--border);border-radius:15px}.top-brand-strip h3{margin-bottom:10px}.notes-files-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:18px}.quick-customer-note{margin-bottom:13px;padding:13px;background:#fffafa;border:1px solid var(--border);border-radius:14px}.quick-customer-note textarea{min-height:82px;margin:0}.quick-customer-note>div{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px}.quick-customer-note label{display:flex;align-items:center;gap:6px;margin:0;color:var(--muted);font-size:9px}.quick-customer-note input{width:auto;min-height:auto}.quick-customer-note .form-response{margin:8px 0 0}.customer-notes-list article header{display:flex;align-items:center;justify-content:space-between;gap:10px}.customer-notes-list article header>div{display:grid}.customer-notes-list article header>span{color:#966000;font-size:8px;font-weight:900}.customer-files-list article{background:#fffafa}.activity-count-badge{padding:6px 10px;color:var(--red);background:var(--pale);border-radius:999px;font-size:9px;font-weight:900}.customer-activity-feed article{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #f1e8e9}.customer-activity-feed article:last-child{border:0}.customer-activity-feed article>span{width:40px;height:40px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:12px}.customer-activity-feed article>div{display:grid}.customer-activity-feed strong{font-size:10px}.customer-activity-feed small,.customer-activity-feed time{color:var(--muted);font-size:8px}.customer-profile-modal .page-modal-card{width:min(94vw,920px);max-height:min(92vh,900px)}.customer-edit-modal-card .page-modal-body{padding:0}.customer-profile-form{padding:22px}.customer-edit-section{padding:16px 0;border-top:1px solid var(--border)}.customer-edit-section:first-of-type{padding-top:4px;border:0}.customer-edit-section h3{margin:0 0 13px;font-size:13px}.customer-profile-form .inline-choice{margin-bottom:14px}.customer-profile-form .form-response{margin:10px 0 0;text-align:center;font-size:10px}.customer-visit-modal-card{width:min(94vw,650px)!important}.customer-profile-form button.is-loading{opacity:.7;pointer-events:none}.customer-profile-form button.is-loading i{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1320px){.customer-file-hero{grid-template-columns:minmax(0,1fr) 460px}.customer-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.customer-file-layout{grid-template-columns:minmax(0,1fr) 285px}.customer-overview-grid{grid-template-columns:1fr}.beauty-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.customer-file-hero{grid-template-columns:1fr}.customer-file-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.customer-file-layout{grid-template-columns:1fr}.customer-file-sidebar{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}.customer-contact-card dl>div{grid-template-columns:82px minmax(0,1fr)}}
@media(max-width:760px){.customer-file-page{gap:12px}.customer-file-hero{padding:16px;border-radius:18px}.customer-identity-row{align-items:flex-start}.customer-avatar-large{width:66px;height:66px;border-radius:20px;font-size:25px}.customer-name-line h1{font-size:22px}.customer-file-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-action-card{min-height:64px;padding:10px}.profile-action-card>i{width:36px;height:36px}.customer-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.customer-kpi-grid article{min-height:100px;padding:12px}.customer-file-sidebar{grid-template-columns:1fr}.customer-file-panels .profile-tab-panel{padding:14px}.next-best-action{grid-template-columns:42px minmax(0,1fr)}.next-best-action>button{grid-column:1/-1;width:100%}.compact-activity-feed article{grid-template-columns:36px minmax(0,1fr)}.compact-activity-feed time{grid-column:2}.purchase-history-card>header{align-items:stretch;flex-direction:column}.purchase-product-list article{grid-template-columns:34px minmax(0,1fr)}.purchase-product-list article>div:last-child{grid-column:2;text-align:right}.beauty-profile-grid{grid-template-columns:1fr}.inferred-interests-panel{grid-template-columns:1fr}.interest-bars article{grid-template-columns:95px minmax(70px,1fr) 22px}.notes-files-layout{grid-template-columns:1fr}.customer-profile-modal .page-modal-card{width:100%;max-height:94vh;border-radius:18px 18px 0 0;align-self:end}.customer-profile-form{padding:18px}.customer-edit-section .form-grid{grid-template-columns:1fr}}
@media(max-width:480px){.customer-meta-line{align-items:flex-start;flex-direction:column}.customer-file-actions{grid-template-columns:1fr 1fr}.profile-action-card small{display:none}.customer-kpi-grid{grid-template-columns:1fr 1fr}.customer-kpi-grid article{gap:8px}.kpi-icon{width:34px;height:34px}.customer-kpi-grid strong{font-size:16px}.customer-file-tabs button{min-height:47px;padding-inline:10px}.customer-file-tabs button span{font-size:10px}.customer-top-products article{grid-template-columns:28px minmax(0,1fr)}.customer-top-products article>div:last-child{grid-column:2;text-align:right}.customer-record-list header{flex-direction:column}.quick-customer-note>div{align-items:stretch;flex-direction:column}.quick-customer-note button{width:100%}}

/* v2.0.9 — customer file intelligence and direct actions */
.profile-action-card.purchase>i{color:#8b4c00;background:#fff1dc}
.customer-insight-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.customer-insight-strip article{min-width:0;display:flex;align-items:center;gap:10px;padding:13px 14px;background:#fff;border:1px solid var(--border);border-radius:15px;box-shadow:0 7px 20px rgba(67,0,6,.035)}
.customer-insight-strip article>span{flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:10px}
.customer-insight-strip article>div{min-width:0;display:grid;gap:2px}
.customer-insight-strip small{color:var(--muted);font-size:8px;font-weight:800}
.customer-insight-strip strong{font-size:11px;line-height:1.6;overflow-wrap:anywhere}
.customer-insight-strip em{color:var(--muted);font-size:7px;font-style:normal}
.purchase-product-thumb{overflow:hidden;background:#fff!important;border:1px solid var(--border)}
.purchase-product-thumb img{width:100%;height:100%;display:block;object-fit:cover}
.purchase-product-list strong a{color:inherit;text-decoration:none}
.purchase-product-list strong a:hover{color:var(--red)}
.stock-state{display:inline-flex;align-items:center;justify-content:flex-start;margin-top:3px;font-size:7px;font-style:normal;font-weight:900}
.stock-state.available{color:#087a4d}.stock-state.unavailable{color:#9b1c1c}
.customer-commerce-card dl{margin:0}
.customer-commerce-card dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px solid #f2eaeb}
.customer-commerce-card dl>div:last-child{border-bottom:0}
.customer-commerce-card dt{color:var(--muted);font-size:9px}.customer-commerce-card dd{margin:0;font-size:9px;font-weight:900;overflow-wrap:anywhere}
.reorder-hint{display:flex;align-items:flex-start;gap:8px;margin-top:11px;padding:10px;color:#704900;background:#fff6dc;border:1px solid #f1dfaa;border-radius:11px;font-size:8px;line-height:1.8}
.reorder-hint i{margin-top:3px}.reorder-hint b{display:block;font-size:8px}
.customer-purchase-modal-card{width:min(94vw,780px)!important}.customer-followup-modal-card{width:min(94vw,680px)!important}
.purchase-total-preview{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0;padding:13px 15px;background:#fff7f7;border:1px solid var(--border);border-radius:13px}
.purchase-total-preview span{color:var(--muted);font-size:10px;font-weight:800}.purchase-total-preview strong{color:var(--red);font-size:18px}
@media(max-width:1320px){.customer-insight-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.customer-insight-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.customer-insight-strip article{padding:11px}.customer-commerce-card dl>div{grid-template-columns:90px minmax(0,1fr)}}
@media(max-width:480px){.customer-insight-strip{grid-template-columns:1fr 1fr}.customer-insight-strip article>span{width:32px;height:32px}.customer-insight-strip strong{font-size:10px}.purchase-total-preview{align-items:flex-start;flex-direction:column}.purchase-total-preview strong{font-size:16px}}
.customer-unified-timeline article>div{gap:2px}
.customer-unified-timeline p{margin:2px 0;color:#674f53;font-size:9px;line-height:1.75;overflow-wrap:anywhere}
.customer-unified-timeline .timeline-purchase>span{color:#8b4c00;background:#fff1dc}
.customer-unified-timeline .timeline-visit>span{color:#1d6d88;background:#eaf7fb}
.customer-unified-timeline .timeline-followup>span{color:#6a4ea0;background:#f1edfb}
.customer-unified-timeline .timeline-note>span{color:#966000;background:#fff5d7}
.customer-unified-timeline .timeline-success>span{color:#087a4d;background:#e8f8f0}
.customer-unified-timeline .timeline-danger>span{color:#9b1c1c;background:#feecec}
.customer-unified-timeline .timeline-muted>span{color:#6b7280;background:#f1f3f5}
.customer-unified-timeline .timeline-system>span{color:var(--red);background:var(--pale)}

/* v2.0.11 — follow-ups work center + visible activity log */
.followups-page-head-v211{align-items:flex-end}.followup-stats-v211{margin-bottom:18px}.followup-inline-panel-v211{scroll-margin-top:96px;border-color:#efc6c9;background:linear-gradient(135deg,#fff,#fff8f8)}.followup-inline-panel-v211.action-panel{border-right:4px solid var(--red)}.inline-panel-head-v211{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.inline-panel-head-v211>div{display:flex;align-items:center;gap:12px}.inline-panel-head-v211>div>span{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:var(--pale);color:var(--red);font-size:17px}.inline-panel-head-v211 h2,.inline-panel-head-v211 p{margin:0}.inline-panel-head-v211 h2{font-size:17px}.inline-panel-head-v211 p{margin-top:3px;color:var(--muted);font-size:11px}.followup-inline-form-v211{max-width:100%}.inline-form-actions-v211,.activity-clear-actions-v211{display:flex;align-items:center;justify-content:flex-end;gap:10px}.followup-filters-v211{position:relative}.followup-worklist-v211{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;visibility:visible!important;opacity:1!important;min-height:1px}.followup-work-card-v211{min-width:0;display:grid;grid-template-columns:96px minmax(0,1fr) 176px;align-items:stretch;gap:0;background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(67,0,6,.045);transition:.18s ease}.followup-work-card-v211:hover{transform:translateY(-2px);border-color:#e8bfc3;box-shadow:0 14px 30px rgba(67,0,6,.08)}.followup-work-card-v211.is-overdue{border-color:#eaa9af;box-shadow:inset -4px 0 #b4000c,0 8px 24px rgba(120,0,1,.06)}.followup-date-v211{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 10px;background:#fff8f8;border-left:1px solid var(--border);text-align:center}.followup-date-v211 small{font-size:9px;color:var(--muted)}.followup-date-v211 strong{font-size:30px;line-height:1.1;color:var(--red)}.followup-date-v211>span{font-size:10px;font-weight:800;color:#664b50}.followup-date-v211 time{margin-top:7px;padding:4px 7px;border-radius:999px;background:#fff;color:#594145;font-size:9px;font-weight:800}.followup-card-body-v211{min-width:0;padding:15px 17px}.followup-card-body-v211>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.followup-customer-v211{min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:7px}.followup-customer-v211>a{font-size:15px;font-weight:900;color:var(--dark)}.followup-customer-v211>a:hover{color:var(--red)}.followup-customer-v211>span,.followup-customer-v211>small{font-size:9px;color:var(--muted)}.followup-customer-v211>small{padding:3px 7px;border-radius:999px;background:#f7f1f2}.followup-state-v211{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:6px}.followup-status-v211{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:4px 9px;border-radius:999px;font-size:9px;font-weight:900}.followup-status-v211.pending{color:#9a5d00;background:#fff3cf}.followup-status-v211.completed{color:#087a4d;background:#e8f8f0}.followup-status-v211.cancelled{color:#7b6568;background:#f2eded}.is-overdue .followup-status-v211{color:#a4000b;background:#fee8ea}.followup-purpose-v211{margin-top:11px;padding:11px 12px;border-radius:12px;background:#fffafa}.followup-purpose-v211>span{display:inline-flex;align-items:center;gap:7px;color:var(--red);font-size:11px;font-weight:900}.followup-purpose-v211 p{margin:5px 0 0;color:#5f474b;font-size:11px;line-height:1.9}.followup-purpose-v211 p.muted{color:var(--muted)}.followup-info-v211{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-top:11px}.followup-info-v211 span{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:9px}.followup-info-v211 i{color:#9b7479}.followup-actions-v211{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:7px;padding:12px;background:#fffafa;border-right:1px solid var(--border)}.followup-mini-action{min-width:0;min-height:38px;display:flex;align-items:center;justify-content:center;gap:6px;padding:7px;border:1px solid var(--border);border-radius:10px;background:#fff;color:#5f454a;font-size:9px;font-weight:900}.followup-mini-action:hover{border-color:var(--red);color:var(--red)}.followup-mini-action.whatsapp{color:#087a4d;background:#eefaf4}.followup-mini-action.complete{color:#087a4d;border-color:#c5ead8}.followup-mini-action.danger{color:#a4000b}.followup-pagination-v211{margin-top:16px}.followup-empty-v211{min-height:220px}.followups-results-wrap{min-width:0}.followup-actions-v211 .fa-whatsapp{font-size:13px}

.activity-page-head-v211{align-items:flex-end}.activity-clear-panel-v211{scroll-margin-top:96px;border:1px solid #e8a5ab;background:linear-gradient(135deg,#fff,#fff5f5);box-shadow:0 16px 38px rgba(120,0,1,.08)}.activity-clear-head-v211{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:17px}.activity-clear-head-v211>div{display:flex;align-items:center;gap:12px}.activity-clear-head-v211>div>span{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;color:#a4000b;background:#fee8ea;font-size:18px}.activity-clear-head-v211 h2,.activity-clear-head-v211 p{margin:0}.activity-clear-head-v211 h2{font-size:18px}.activity-clear-head-v211 p{margin-top:4px;color:var(--muted);font-size:11px}.activity-clear-form-v211{max-width:900px}.activity-filter-panel-v211{padding:17px}.activity-filters-v211{grid-template-columns:minmax(230px,2fr) repeat(4,minmax(145px,1fr))}.activity-panel-v211{padding:0!important;overflow:hidden!important}.activity-toolbar-v211{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 20px;background:#fffafa;border-bottom:1px solid var(--border)}.activity-toolbar-v211>div{display:grid;gap:3px}.activity-toolbar-v211 strong{font-size:14px}.activity-toolbar-v211 small,.activity-toolbar-v211>span{font-size:10px;color:var(--muted)}.activity-toolbar-v211>span{display:inline-flex;align-items:center;gap:6px}.activity-log-list-v211{display:block!important;width:100%!important;min-height:1px!important;visibility:visible!important;opacity:1!important}.activity-log-row-v211{display:grid!important;grid-template-columns:48px minmax(0,1fr) minmax(190px,auto)!important;align-items:center;gap:13px;width:100%;min-height:76px;padding:13px 18px;background:#fff;border-bottom:1px solid var(--border);visibility:visible!important;opacity:1!important;color:var(--text)!important}.activity-log-row-v211:last-child{border-bottom:0}.activity-log-row-v211:hover{background:#fffafa}.activity-log-icon-v211{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;color:var(--red);background:var(--pale);font-size:15px}.activity-log-row-v211.tone-success .activity-log-icon-v211{color:#087a4d;background:#e8f8f0}.activity-log-row-v211.tone-danger .activity-log-icon-v211{color:#a4000b;background:#fee8ea}.activity-log-row-v211.tone-warning .activity-log-icon-v211{color:#9a5d00;background:#fff3cf}.activity-log-main-v211{min-width:0}.activity-log-main-v211>div{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.activity-log-main-v211 strong{font-size:12px}.activity-action-code-v211{padding:3px 7px;border-radius:999px;background:#f6f0f1;color:#80686c;font-size:8px}.activity-log-main-v211 p{margin:4px 0 0;color:var(--muted);font-size:10px}.activity-log-main-v211 p span{color:#5f474b;font-weight:800}.activity-log-main-v211 details{margin-top:7px;padding:7px 9px;border:1px dashed #eadadd;border-radius:9px;background:#fffafa;color:#61494d;font-size:9px}.activity-log-main-v211 summary{cursor:pointer;color:var(--red);font-weight:800}.activity-log-main-v211 details>div{margin-top:6px;line-height:1.8;overflow-wrap:anywhere}.activity-log-meta-v211{display:grid;justify-items:end;gap:6px}.activity-log-meta-v211 time{font-size:10px;color:#584247;white-space:nowrap}.activity-log-meta-v211 code{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 8px;border-radius:8px;background:#f6f0f1;color:#684f54;font-family:Cairo,sans-serif;font-size:9px}.activity-empty-v211{min-height:230px;display:grid;place-items:center;align-content:center;gap:7px;padding:30px;text-align:center;color:var(--muted)}.activity-empty-v211 i{font-size:34px;color:var(--red)}.activity-empty-v211 h3,.activity-empty-v211 p{margin:0}.activity-empty-v211 h3{color:var(--text)}.activity-pagination-v211{display:flex;align-items:center;justify-content:center;gap:12px;padding:15px;border-top:1px solid var(--border);background:#fffafa}.activity-pagination-v211>span{font-size:10px;color:var(--muted)}.activity-pagination-v211 .disabled{pointer-events:none;opacity:.45}

@media(max-width:1180px){.followup-work-card-v211{grid-template-columns:88px minmax(0,1fr)}.followup-actions-v211{grid-column:1/-1;grid-template-columns:repeat(6,minmax(90px,1fr));border-right:0;border-top:1px solid var(--border)}.activity-filters-v211{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-filters-v211 .filter-search{grid-column:1/-1}}
@media(max-width:760px){.followups-page-head-v211,.activity-page-head-v211,.inline-panel-head-v211,.activity-clear-head-v211{align-items:stretch;flex-direction:column}.followups-page-head-v211 .btn,.activity-page-head-v211 .btn{width:100%}.followup-stats-v211{grid-template-columns:repeat(2,minmax(0,1fr))}.followup-work-card-v211{grid-template-columns:74px minmax(0,1fr)}.followup-date-v211{padding:10px 6px}.followup-card-body-v211{padding:13px}.followup-card-body-v211>header{flex-direction:column}.followup-state-v211{justify-content:flex-start}.followup-actions-v211{grid-template-columns:repeat(3,minmax(0,1fr))}.activity-filters-v211{grid-template-columns:minmax(0,1fr)}.activity-filters-v211 .filter-search{grid-column:auto}.activity-log-row-v211{grid-template-columns:42px minmax(0,1fr)!important;padding:12px}.activity-log-meta-v211{grid-column:1/-1;grid-template-columns:1fr 1fr;justify-items:start;padding-right:55px}.activity-log-meta-v211 code{max-width:100%}.activity-clear-form-v211 .form-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:480px){.followup-stats-v211{grid-template-columns:minmax(0,1fr)}.followup-work-card-v211{grid-template-columns:minmax(0,1fr)}.followup-date-v211{display:grid;grid-template-columns:auto auto auto 1fr;justify-content:start;gap:7px;border-left:0;border-bottom:1px solid var(--border);text-align:right}.followup-date-v211 strong{font-size:20px}.followup-date-v211 time{margin:0;margin-right:auto}.followup-actions-v211{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-log-row-v211{grid-template-columns:38px minmax(0,1fr)!important}.activity-log-icon-v211{width:36px;height:36px}.activity-log-meta-v211{padding-right:0;grid-template-columns:minmax(0,1fr)}.activity-clear-actions-v211,.inline-form-actions-v211{align-items:stretch;flex-direction:column}.activity-clear-actions-v211 .btn,.inline-form-actions-v211 .btn{width:100%}}

/* v2.0.12 — requested CRM refinements */
.customer-insight-strip{grid-template-columns:repeat(4,minmax(0,1fr))}

/* Follow-ups: status tabs and a clean card footer that can never escape the card. */
.followup-stats-v211{grid-template-columns:repeat(6,minmax(0,1fr))}
.followup-work-card-v211{grid-template-columns:84px minmax(0,1fr)!important;overflow:hidden!important}
.followup-actions-v211{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;align-items:stretch!important;padding:9px 12px!important;border-right:0!important;border-top:1px solid var(--border)!important;background:#fffafa!important}
.followup-mini-action{width:100%;min-width:0!important;min-height:34px!important;padding:6px 8px!important;white-space:nowrap}
.followup-card-body-v211{padding:13px 15px!important}
.followup-purpose-v211{margin-top:8px!important;padding:8px 10px!important}
.followup-info-v211{margin-top:8px!important}

/* Products: denser rows so the screen shows considerably more products. */
.store-product-row{min-height:88px!important;grid-template-columns:28px 62px minmax(0,1fr) auto!important;padding:8px 10px!important;gap:9px!important;border-radius:14px!important}
.store-product-row-image{width:60px!important;height:60px!important;border-radius:10px!important}
.store-product-row-image img{width:100%!important;height:100%!important;object-fit:contain!important}
.store-product-row-main{gap:6px!important}
.store-product-row-title h3{font-size:12px!important;line-height:1.45!important;margin:0!important}
.store-product-row-title p{font-size:8.5px!important;margin-top:2px!important}
.store-product-row-meta{gap:6px!important}
.store-product-row-meta>div{min-height:40px!important;padding:5px 7px!important;border-radius:9px!important}
.store-product-row-meta span,.store-product-row-meta time{font-size:7.5px!important}
.store-product-row-meta strong{font-size:9px!important}
.store-product-row-price strong{font-size:11px!important}
.store-product-row-action .btn{min-height:34px!important;padding:6px 9px!important;font-size:8.5px!important}
.product-active-state{font-size:7.5px!important;padding:3px 7px!important}

/* New-order dashboard alerts. */
.dashboard-order-alerts{margin-bottom:18px;padding:16px;border:1px solid #efc8cb;border-radius:18px;background:linear-gradient(135deg,#fff,#fff7f7);box-shadow:0 12px 32px rgba(80,0,7,.06)}
.dashboard-alert-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.dashboard-alert-head>div{display:flex;align-items:center;gap:11px}.dashboard-alert-head>div>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--red);color:#fff}
.dashboard-alert-head h2,.dashboard-alert-head p{margin:0}.dashboard-alert-head h2{font-size:16px}.dashboard-alert-head p{margin-top:3px;color:var(--muted);font-size:10px}
.dashboard-order-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dashboard-order-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;padding:12px;border:1px solid var(--border);border-radius:14px;background:#fff}
.order-alert-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--pale);color:var(--red)}
.dashboard-order-card strong{font-size:11px}.dashboard-order-card p{margin:4px 0;color:#624b50;font-size:9px;line-height:1.8}.dashboard-order-card small{color:var(--muted);font-size:8px}
.order-alert-actions{display:flex;align-items:center;gap:7px;margin-top:8px}.order-alert-actions form{margin:0}

/* Loyalty windows. */
.loyalty-rule-editor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.loyalty-rule-editor>section{display:grid;gap:11px;padding:14px;border:1px solid var(--border);border-radius:14px;background:#fffafa}
.loyalty-rule-editor h3{display:flex;align-items:center;gap:8px;margin:0;color:var(--dark);font-size:12px}.loyalty-rule-editor h3 i{color:var(--red)}

/* Marketing intelligence: any synced category can be selected. */
.marketing-settings-card{width:min(95vw,920px)!important}
.marketing-category-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:6px}.marketing-category-heading>div{display:grid;gap:3px}.marketing-category-heading strong{font-size:12px}.marketing-category-heading small{color:var(--muted);font-size:9px}.marketing-category-heading>span{padding:5px 9px;border-radius:999px;background:var(--pale);color:var(--red);font-size:8px;font-weight:900}
.marketing-category-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:360px;overflow:auto;padding:4px}
.marketing-category-rule{display:grid!important;grid-template-columns:22px minmax(0,1fr) 130px;align-items:center;gap:9px;padding:10px!important;border:1px solid var(--border);border-radius:12px;background:#fff;cursor:pointer}
.marketing-category-rule>input{position:absolute;opacity:0;pointer-events:none}.category-rule-check{width:21px;height:21px;display:grid;place-items:center;border:1px solid #dbc8ca;border-radius:7px;color:transparent;background:#fff}.marketing-category-rule.selected{border-color:#dfa8ad;background:#fff9f9}.marketing-category-rule.selected .category-rule-check{border-color:var(--red);background:var(--red);color:#fff}.marketing-category-rule>b{font-size:10px}.marketing-category-rule .unit-input{min-width:0}.marketing-category-rule .unit-input input{min-width:0;height:34px}

/* One-time recovery codes. */
.recovery-codes-warning{display:flex;gap:10px;padding:11px;border:1px solid #e9c26f;border-radius:12px;background:#fff9e9;color:#745100}.recovery-codes-warning>i{margin-top:3px}.recovery-codes-warning strong,.recovery-codes-warning p{margin:0}.recovery-codes-warning strong{font-size:11px}.recovery-codes-warning p{margin-top:2px;font-size:9px;line-height:1.7}
.recovery-code-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:12px 0}.recovery-code-grid code{padding:9px;border:1px dashed #d7b5b8;border-radius:9px;background:#fff8f8;text-align:center;font-size:10px;font-weight:900;letter-spacing:.5px}
.recovery-login-card{max-width:470px!important}.recovery-page-icon{width:48px;height:48px;display:grid;place-items:center;margin:0 auto 8px;border-radius:15px;background:var(--pale);color:var(--red);font-size:19px}.recovery-back-link{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:14px;color:var(--muted);font-size:10px}.recovery-login-card label small{display:block;margin-top:4px;color:var(--muted);font-size:8px}.form-success{display:flex;align-items:flex-start;gap:8px;margin:12px 0;padding:10px;border-radius:10px;background:#eaf8f1;color:#087a4d;font-size:10px;line-height:1.7}

@media(max-width:1180px){.followup-stats-v211{grid-template-columns:repeat(3,minmax(0,1fr))}.store-product-row{grid-template-columns:28px 58px minmax(0,1fr)!important}.store-product-row-action{grid-column:3;justify-self:start}.dashboard-order-grid{grid-template-columns:1fr}}
@media(max-width:760px){.customer-insight-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.followup-actions-v211{grid-template-columns:repeat(3,minmax(0,1fr))!important}.loyalty-rule-editor,.marketing-category-rules{grid-template-columns:1fr}.dashboard-alert-head{align-items:stretch;flex-direction:column}.store-product-row{grid-template-columns:24px 54px minmax(0,1fr)!important}.store-product-row-meta{grid-template-columns:repeat(2,minmax(0,1fr))!important}.marketing-category-rule{grid-template-columns:22px minmax(0,1fr) 110px}.recovery-code-grid{grid-template-columns:1fr}}
@media(max-width:480px){.followup-actions-v211{grid-template-columns:repeat(2,minmax(0,1fr))!important}.store-product-row{grid-template-columns:50px minmax(0,1fr)!important}.store-product-row-number{display:none}.store-product-row-image{width:48px!important;height:48px!important}.store-product-row-action{grid-column:2}.order-alert-actions{align-items:stretch;flex-direction:column}.order-alert-actions .btn{width:100%}}
.followup-actions-v211{grid-template-columns:repeat(auto-fit,minmax(105px,1fr))!important}
@media(max-width:760px){.followup-actions-v211{grid-template-columns:repeat(auto-fit,minmax(92px,1fr))!important}}
.recovery-reminder{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding:12px 14px;border:1px solid #e9c26f;border-radius:14px;background:#fff9e9}.recovery-reminder>i{font-size:20px;color:#9a6900}.recovery-reminder>div{flex:1}.recovery-reminder strong,.recovery-reminder p{margin:0}.recovery-reminder strong{font-size:11px}.recovery-reminder p{margin-top:3px;color:#765d28;font-size:9px}.recovery-reminder .btn{flex:none}
@media(max-width:760px){.recovery-reminder{align-items:stretch;flex-direction:column}.recovery-reminder .btn{width:100%}}


/* v2.0.12 — plain-language marketing intelligence guide. */
.marketing-how-it-works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.marketing-how-it-works article{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:13px;border:1px solid var(--border);border-radius:14px;background:#fff}
.marketing-how-it-works article>span{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--red);color:#fff;font-size:11px;font-weight:900}
.marketing-how-it-works strong,.marketing-how-it-works p{margin:0}.marketing-how-it-works strong{font-size:11px}.marketing-how-it-works p{margin-top:3px;color:var(--muted);font-size:9px;line-height:1.8}
.marketing-category-freedom-note{display:flex;align-items:center;gap:11px;margin-bottom:14px;padding:12px 14px;border:1px solid #e5c2c5;border-radius:14px;background:#fff8f8}
.marketing-category-freedom-note>i{width:38px;height:38px;display:grid;place-items:center;flex:none;border-radius:11px;background:var(--pale);color:var(--red)}
.marketing-category-freedom-note>div{min-width:0;flex:1}.marketing-category-freedom-note strong,.marketing-category-freedom-note p{margin:0}.marketing-category-freedom-note strong{font-size:11px}.marketing-category-freedom-note p{margin-top:3px;color:var(--muted);font-size:9px;line-height:1.8}
@media(max-width:900px){.marketing-how-it-works{grid-template-columns:1fr}.marketing-category-freedom-note{align-items:stretch;flex-direction:column}.marketing-category-freedom-note .btn{width:100%}}
.loyalty-progress-row header>span{display:grid;gap:1px}.loyalty-progress-row header>span small{color:var(--muted);font-size:7px;font-weight:700}

/* ========================================================================== 
   Ghazalah CRM v2.0.13 — final delivery polish
   ========================================================================== */

/* Required marks always stay beside the label title. */
.crm-form label:has(> .required-mark),
.survey-card label:has(> .required-mark),
.login-card label:has(> .required-mark),
.public-customer-form label:has(> .required-mark){display:block!important;font-weight:700}
.required-mark{display:inline!important;position:static!important;margin-inline-start:3px;color:var(--red);font-size:1em;font-weight:900;line-height:1;vertical-align:baseline}
.crm-form label:has(> .required-mark)>:is(input,select,textarea,.password-input,.money-input,.unit-input,.custom-select),
.survey-card label:has(> .required-mark)>:is(input,select,textarea,.password-input,.money-input,.unit-input,.custom-select),
.login-card label:has(> .required-mark)>:is(input,select,textarea,.password-input,.money-input,.unit-input,.custom-select),
.public-customer-form label:has(> .required-mark)>:is(input,select,textarea,.password-input,.money-input,.unit-input,.custom-select){margin-top:7px;width:100%}

/* Customer 360: larger, clearer typography without making the page bulky. */
.customer-file-page{font-size:15px!important}
.customer-name-line h1{font-size:31px!important;line-height:1.35!important}
.customer-meta-line span{font-size:13px!important;line-height:1.7!important}
.customer-flag{font-size:11.5px!important;min-height:29px!important;padding:5px 10px!important}
.customer-back-link{font-size:12px!important}
.profile-action-card span b{font-size:14.5px!important;line-height:1.5!important}
.profile-action-card span small{font-size:10.5px!important;line-height:1.55!important}
.customer-kpi-grid article small{font-size:11.5px!important}
.customer-kpi-grid article strong{font-size:23px!important;line-height:1.35!important}
.customer-kpi-grid article strong.date-value{font-size:14px!important}
.customer-kpi-grid article em{font-size:9.5px!important;line-height:1.55!important}
.customer-insight-strip article small{font-size:10.5px!important}
.customer-insight-strip article strong{font-size:13px!important;line-height:1.5!important}
.customer-insight-strip article em{font-size:9px!important}
.customer-file-tabs button{font-size:12.5px!important;padding:12px 11px!important}
.profile-section-title h2{font-size:18px!important}
.profile-section-title p{font-size:11.5px!important;line-height:1.8!important}
.next-best-action strong,.customer-record-list strong,.purchase-history-card h3,.purchase-product-list strong,.beauty-profile-grid strong,.profile-side-card h2{font-size:13.5px!important}
.next-best-action p,.customer-record-list p,.purchase-product-list small,.profile-side-card p,.customer-activity-feed p,.notes-list p{font-size:11.5px!important;line-height:1.85!important}
.customer-record-list time,.customer-record-list small,.purchase-history-card small,.profile-side-card dt,.profile-side-card small,.customer-activity-feed small,.customer-activity-feed time{font-size:10px!important}
.profile-side-card dd{font-size:12px!important;line-height:1.65!important}
.customer-unified-timeline strong{font-size:12.5px!important}
.quick-customer-note textarea{font-size:12px!important}
.delete-profile-action{font:inherit;text-align:right;cursor:pointer}
.profile-action-card.danger{border-color:#efc1c5!important;background:#fff7f7!important;color:#9f000b!important}
.profile-action-card.danger>i{background:#fee8ea!important;color:#a4000b!important}
.profile-action-card.danger:hover{border-color:#b4000c!important;background:#fff0f1!important}
.record-header-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:7px}
.record-pills .icon-btn,.record-header-actions .icon-btn{width:31px;height:31px;margin:0}
.purchase-history-card>header .record-header-actions{align-self:flex-start}
.customer-notes-list article header{gap:10px}

/* Follow-up cards: larger copy and reliable action layout. */
.followup-work-card-v211{font-size:14px!important}
.followup-date-v211 small{font-size:10px!important}.followup-date-v211>span{font-size:11px!important}.followup-date-v211 time{font-size:10px!important}
.followup-customer-v211>a{font-size:17px!important}.followup-customer-v211>span,.followup-customer-v211>small{font-size:10.5px!important}
.followup-status-v211,.followup-state-v211 .priority{font-size:10px!important}
.followup-purpose-v211>span{font-size:13px!important}.followup-purpose-v211 p{font-size:12px!important;line-height:1.85!important}
.followup-info-v211 span{font-size:10.5px!important;line-height:1.6!important}
.followup-mini-action{font-size:10.5px!important;font-family:Cairo,sans-serif!important;border-style:solid}
.followup-actions-v211{grid-template-columns:repeat(auto-fit,minmax(92px,1fr))!important}

/* Dynamic users/permissions modal: pronounced left curve with inner scrolling. */
.modal-card:has(.user-form){width:min(96vw,980px)!important;max-height:92vh!important;padding:0!important;border-top-left-radius:46px!important;border-bottom-left-radius:46px!important;border-top-right-radius:20px!important;border-bottom-right-radius:20px!important;overflow:hidden!important}
.modal-card:has(.user-form) .modal-close{z-index:3;left:22px;top:14px}
#modalBody:has(.user-form){max-height:92vh;overflow-y:auto;overflow-x:hidden;padding:26px 34px 28px 42px;scrollbar-gutter:stable}
#modalBody:has(.user-form) .user-form{max-width:none;margin:0}

/* Marketing intelligence modal: one useful scrollbar, kept away from the curve. */
.marketing-settings-card{width:min(96vw,960px)!important;height:min(90vh,820px)!important;max-height:min(90vh,820px)!important;border-top-left-radius:48px!important;border-bottom-left-radius:48px!important;border-top-right-radius:20px!important;border-bottom-right-radius:20px!important;overflow:hidden!important}
.marketing-settings-card>.page-modal-body{height:100%;overflow:hidden!important;padding:0!important}
.marketing-settings-card .settings-modal-form{height:100%;display:grid;grid-template-rows:auto auto auto auto minmax(150px,1fr) auto auto;gap:13px;overflow:hidden!important;padding:25px 30px 24px 42px!important}
.marketing-purpose-card{display:grid;grid-template-columns:43px minmax(0,1fr);gap:11px;align-items:start;padding:12px 13px;border:1px solid #edc9cc;border-radius:14px;background:#fff8f8}
.marketing-purpose-card>i{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;background:var(--pale);color:var(--red);font-size:16px}
.marketing-purpose-card strong,.marketing-purpose-card p{margin:0}.marketing-purpose-card strong{font-size:12px}.marketing-purpose-card p{margin-top:3px;color:#684f54;font-size:10px;line-height:1.85}
.marketing-settings-card .marketing-category-rules{min-height:0!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;padding:5px 4px 5px 15px!important;scrollbar-gutter:stable}
.marketing-settings-card .page-modal-close{left:24px!important;top:18px!important;z-index:4}
.marketing-settings-card .marketing-category-rule>b{font-size:11px!important}

/* Recovery code result is a dedicated codes-only step. */
#settings-recovery-modal .settings-modal-form{gap:13px}
#settings-recovery-modal .recovery-code-grid code{font-size:11px!important;user-select:all}

/* Deletion actions. */
.danger-text{color:#a4000b!important}.danger-text:hover{border-color:#a4000b!important;background:#fff0f1!important}
.page-head-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}
.campaign-history-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:center;gap:8px;border-bottom:1px solid var(--border)}
.campaign-history-item:last-child{border-bottom:0}
.campaign-history-item>a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 14px;padding:13px 4px!important;border:0!important}
.campaign-history-item>a .mini-progress{grid-column:1/-1}
.campaign-delete-btn{margin:0!important}

/* Live reports. */
.live-reports-page{display:grid;gap:0}
.live-report-head{align-items:flex-start}
.live-report-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}
.live-report-status{min-height:44px;display:grid;grid-template-columns:10px auto;align-items:center;column-gap:8px;padding:7px 12px;border:1px solid #c8e8d8;border-radius:12px;background:#effaf4;color:#087a4d}
.live-report-status>i,.chart-live-chip>i{width:9px;height:9px;border-radius:50%;background:#13a566;box-shadow:0 0 0 0 rgba(19,165,102,.45);animation:live-status-pulse 1.8s infinite}
.live-report-status>span{font-size:10px;font-weight:900}.live-report-status>small{grid-column:2;color:#4b7763;font-size:8px}.live-report-status.syncing>i{background:#e69800}.live-report-status.offline{border-color:#efc1c5;background:#fff0f1;color:#a4000b}.live-report-status.offline>i{background:#a4000b;animation:none}
.live-report-clock{min-height:44px;display:flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--border);border-radius:12px;background:#fff}.live-report-clock i{color:var(--red)}.live-report-clock strong{font-size:12px;font-variant-numeric:tabular-nums}
.report-live-banner{position:relative;min-height:94px;display:grid;grid-template-columns:50px minmax(0,1fr) minmax(220px,420px);align-items:center;gap:14px;margin-bottom:15px;padding:16px 18px;border:1px solid #e8bcc0;border-radius:19px;background:linear-gradient(135deg,#fff,#fff5f6);overflow:hidden;box-shadow:0 12px 34px rgba(84,0,7,.06)}
.report-pulse-icon{width:50px;height:50px;display:grid;place-items:center;border-radius:15px;background:var(--red);color:#fff;font-size:18px;box-shadow:0 9px 22px rgba(180,0,12,.2)}
.report-live-banner strong,.report-live-banner p{margin:0}.report-live-banner strong{font-size:15px}.report-live-banner p{margin-top:4px;color:var(--muted);font-size:10.5px;line-height:1.8}
.report-running-bars{height:50px;display:flex;align-items:flex-end;justify-content:flex-end;gap:5px;direction:ltr}.report-running-bars i{width:8px;height:calc(12px + (var(--i) % 6)*6px);border-radius:6px 6px 2px 2px;background:linear-gradient(to top,#b4000c,#f3a5ac);transform-origin:bottom;animation:report-bar-live 1.25s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.07s)}
.live-report-kpis{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.live-report-kpis article{position:relative;overflow:hidden;min-height:135px}.live-report-kpis article:after{content:"";position:absolute;left:-20px;bottom:-32px;width:82px;height:82px;border-radius:50%;background:var(--pale);opacity:.7}.live-report-kpis article>span{display:flex;align-items:center;gap:7px}.live-report-kpis article>span i{color:var(--red)}.live-report-kpis article>strong{position:relative;z-index:1;font-size:22px!important}.live-report-kpis article>small{position:relative;z-index:1;font-size:9px!important;line-height:1.6}.live-report-kpis article>small i{color:#0d9b60}
.live-reports-layout{grid-template-columns:minmax(0,2.1fr) minmax(280px,.9fr)!important}
.live-chart-panel{overflow:hidden}.chart-live-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border-radius:999px;background:#ecf9f2;color:#087a4d;font-size:9px;font-weight:900;letter-spacing:.8px}
.live-chart-wrap{position:relative;height:330px;padding-top:10px}.live-chart-wrap svg{display:block;width:100%;height:290px;overflow:visible}
.live-chart-grid line{stroke:#eadbdd;stroke-width:1;stroke-dasharray:5 7}.live-sales-area{fill:url(#liveAreaGradient);stroke:none}.live-sales-line{fill:none;stroke:#b4000c;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:url(#lineGlow);stroke-dasharray:2000;stroke-dashoffset:0}
.live-chart-point circle{fill:#fff;stroke:#b4000c;stroke-width:3;transition:.2s}.live-chart-point.latest circle{fill:#b4000c;transform-box:fill-box;transform-origin:center;animation:latest-point-pulse 1.5s infinite}.live-chart-axis{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;padding:0 26px}
.chart-insight-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:13px}.chart-insight-row article{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:8px;padding:9px;border:1px solid var(--border);border-radius:11px;background:#fffafa}.chart-insight-row i{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--pale);color:var(--red)}.chart-insight-row strong,.chart-insight-row small{display:block}.chart-insight-row strong{font-size:10px}.chart-insight-row small{margin-top:2px;color:var(--muted);font-size:8px;line-height:1.5}
.live-source-breakdown{display:grid;gap:12px}.live-source-breakdown article{display:grid;gap:6px}.live-source-breakdown article>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}.live-source-breakdown span{font-size:11px}.live-source-breakdown strong{font-size:12px}.source-live-bar{height:8px;border-radius:999px;background:#f3e8e9;overflow:hidden}.source-live-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--red),#e16a74);animation:source-bar-enter .8s ease both}
@keyframes live-status-pulse{70%{box-shadow:0 0 0 8px rgba(19,165,102,0)}100%{box-shadow:0 0 0 0 rgba(19,165,102,0)}}
@keyframes report-bar-live{from{transform:scaleY(.38);opacity:.55}to{transform:scaleY(1);opacity:1}}
@keyframes live-line-draw{from{stroke-dashoffset:2000}to{stroke-dashoffset:0}}
@keyframes latest-point-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.9);opacity:.55}}
@keyframes source-bar-enter{from{width:0}}

/* QR registration admin page. */
.qr-registration-layout{display:grid;grid-template-columns:minmax(430px,.95fr) minmax(0,1.05fr);gap:18px;align-items:start}
.qr-display-panel{text-align:center;padding:24px!important;background:linear-gradient(145deg,#fff,#fff8f8)}
.qr-live-badge{width:max-content;margin:0 auto 13px;display:flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:#eaf8f1;color:#087a4d;font-size:10px;font-weight:900}.qr-live-badge i{width:8px;height:8px;border-radius:50%;background:#12a465;animation:live-status-pulse 1.8s infinite}
.customer-qr-code{width:min(100%,410px);aspect-ratio:1;margin:0 auto 14px;display:grid;place-items:center;padding:14px;border:1px solid #e4c7ca;border-radius:28px;background:#fff;box-shadow:0 18px 48px rgba(72,0,7,.1)}.customer-qr-code svg{display:block;width:100%;height:100%}.qr-loading{display:grid;place-items:center;gap:8px;color:var(--muted)}.qr-display-panel h2,.qr-display-panel p{margin:0}.qr-display-panel h2{font-size:21px}.qr-display-panel p{margin-top:5px;color:var(--muted);font-size:11px}
.qr-link-box{display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:7px;margin-top:15px}.qr-link-box input{min-width:0;height:42px;padding:8px 11px;border:1px solid var(--border);border-radius:10px;background:#fff;text-align:left;font-size:9px}.qr-link-box .icon-btn{width:42px;height:42px;margin:0}
.qr-primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.qr-help-column{display:grid;gap:14px}.qr-workflow-card ol{display:grid;gap:5px;margin:0;padding:0;list-style:none}.qr-workflow-card li{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--border)}.qr-workflow-card li:last-child{border-bottom:0}.qr-workflow-card li>span{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:var(--pale);color:var(--red);font-weight:900}.qr-workflow-card strong,.qr-workflow-card p{margin:0}.qr-workflow-card strong{font-size:12px}.qr-workflow-card p{margin-top:2px;color:var(--muted);font-size:9.5px;line-height:1.7}
.qr-security-card{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;padding:15px;border:1px solid #cce6da;border-radius:16px;background:#effaf4}.qr-security-card>span{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:#dff4e9;color:#087a4d;font-size:20px}.qr-security-card strong,.qr-security-card p{margin:0}.qr-security-card strong{font-size:13px}.qr-security-card p{margin-top:3px;color:#477160;font-size:10px;line-height:1.75}
.qr-use-cases{padding:16px;border:1px solid var(--border);border-radius:16px;background:#fff}.qr-use-cases h3{margin:0 0 10px;font-size:13px}.qr-use-cases>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.qr-use-cases span{display:flex;align-items:center;gap:8px;padding:10px;border-radius:11px;background:#fff8f8;font-size:10px;font-weight:800}.qr-use-cases i{color:var(--red)}

/* Public self-registration page reached through QR. */
.public-register-page{min-height:100vh;background:radial-gradient(circle at 10% 10%,#fff 0,#fff6f7 35%,#f9ecee 100%);padding:22px;color:var(--text)}
.public-register-shell{width:min(100%,760px);margin:0 auto}.public-register-brand{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px;padding:10px 14px;border:1px solid rgba(224,190,194,.8);border-radius:16px;background:rgba(255,255,255,.82);backdrop-filter:blur(10px)}.public-register-brand img{width:122px;height:48px;object-fit:contain}.public-register-brand span{display:flex;align-items:center;gap:7px;color:#087a4d;font-size:10px;font-weight:800}
.public-register-card{padding:25px;border:1px solid #e5c9cc;border-radius:25px;background:#fff;box-shadow:0 24px 70px rgba(67,0,6,.12)}.public-register-heading{display:grid;grid-template-columns:54px minmax(0,1fr);gap:13px;align-items:center;margin-bottom:20px}.public-register-heading>span{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:var(--pale);color:var(--red);font-size:21px}.public-register-heading h1,.public-register-heading p{margin:0}.public-register-heading h1{font-size:23px}.public-register-heading p{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.75}.public-customer-form label{font-size:12px}.public-whatsapp-field{margin:3px 0 15px;border:0;padding:0}.public-whatsapp-field legend{margin-bottom:8px;font-size:12px;font-weight:800}.public-consent{font-size:10.5px!important;line-height:1.8}.public-register-submit{min-height:50px;font-size:13px}.public-privacy-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:10px 0 0;color:var(--muted);font-size:9px}.public-privacy-note i{color:#087a4d}.public-register-success{text-align:center;padding:35px 10px}.public-register-success>span{width:74px;height:74px;display:grid;place-items:center;margin:0 auto 14px;border-radius:23px;background:#eaf8f1;color:#087a4d;font-size:32px}.public-register-success h1,.public-register-success p{margin:0}.public-register-success h1{font-size:25px}.public-register-success p{margin-top:7px;font-size:13px}.public-register-success small{display:block;margin-top:9px;color:var(--muted);font-size:10px;line-height:1.8}

@media(max-width:1250px){.live-report-kpis{grid-template-columns:repeat(3,minmax(0,1fr))!important}.report-live-banner{grid-template-columns:50px minmax(0,1fr)}.report-running-bars{grid-column:1/-1;height:32px}.qr-registration-layout{grid-template-columns:minmax(350px,.9fr) minmax(0,1.1fr)}}
@media(max-width:900px){.live-reports-layout,.qr-registration-layout{grid-template-columns:1fr!important}.live-report-actions{justify-content:flex-start}.chart-insight-row{grid-template-columns:1fr}.modal-card:has(.user-form){border-radius:22px 22px 0 0!important;align-self:end}.marketing-settings-card{border-radius:22px 22px 0 0!important;height:94vh!important;max-height:94vh!important}.marketing-settings-card .settings-modal-form{padding:22px 20px 20px 27px!important}.qr-display-panel{order:1}.qr-help-column{order:2}}
@media(max-width:760px){.customer-name-line h1{font-size:25px!important}.customer-file-page{font-size:14px!important}.followup-customer-v211>a{font-size:15px!important}.followup-purpose-v211 p{font-size:11.5px!important}.live-report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}.live-report-head,.live-report-actions{align-items:stretch;flex-direction:column}.live-report-actions>*{width:100%}.live-report-status{grid-template-columns:10px minmax(0,1fr)}.report-live-banner{grid-template-columns:42px minmax(0,1fr);padding:13px}.report-pulse-icon{width:42px;height:42px}.report-running-bars{display:none}.live-chart-wrap{height:270px}.live-chart-wrap svg{height:235px}.qr-use-cases>div,.qr-primary-actions{grid-template-columns:1fr}.customer-qr-code{width:min(100%,360px)}#modalBody:has(.user-form){padding:22px 18px 24px 24px}.campaign-history-item{grid-template-columns:minmax(0,1fr) 40px}.campaign-history-item>a{grid-template-columns:1fr}.campaign-history-item>a>span{justify-self:start}}
@media(max-width:520px){.live-report-kpis{grid-template-columns:1fr!important}.public-register-page{padding:10px}.public-register-card{padding:18px;border-radius:20px}.public-register-brand{align-items:flex-start;flex-direction:column}.public-register-heading{grid-template-columns:45px minmax(0,1fr)}.public-register-heading>span{width:45px;height:45px}.public-register-heading h1{font-size:19px}.public-register-card .form-grid{grid-template-columns:1fr}.customer-qr-code{padding:8px;border-radius:20px}.qr-display-panel{padding:16px!important}.marketing-category-rule{grid-template-columns:22px minmax(0,1fr)!important}.marketing-category-rule .unit-input{grid-column:2}.record-header-actions{justify-content:flex-start}}

@media print{
 body:has(.qr-customers-page) .sidebar,body:has(.qr-customers-page) .topbar,body:has(.qr-customers-page) .mobile-nav,body:has(.qr-customers-page) .page-head,body:has(.qr-customers-page) .qr-help-column,body:has(.qr-customers-page) .qr-primary-actions,body:has(.qr-customers-page) .qr-link-box,body:has(.qr-customers-page) .qr-live-badge{display:none!important}
 body:has(.qr-customers-page){background:#fff}.shell:has(.qr-customers-page){margin:0!important}.content:has(.qr-customers-page){padding:0!important}.qr-registration-layout{display:block!important}.qr-display-panel{border:0!important;box-shadow:none!important;margin:0!important}.customer-qr-code{width:150mm!important;max-width:90vw!important;border:0!important;box-shadow:none!important}.qr-display-panel h2{font-size:24pt!important}.qr-display-panel p{font-size:12pt!important}
}

/* Continuous live signal travelling over the real sales line. */
.live-sales-pulse{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:5 28;opacity:.95;filter:url(#lineGlow);pointer-events:none;animation:live-signal-travel 2.8s linear infinite}
@keyframes live-signal-travel{to{stroke-dashoffset:-132}}
@media(prefers-reduced-motion:reduce){.live-sales-pulse,.report-running-bars i,.live-report-status>i,.chart-live-chip>i{animation-duration:8s!important}}

/* =========================================================
   Ghazalah CRM v2.0.14 — delivery refinements
   ========================================================= */

/* Customer table WhatsApp action: icon + clear label */
.customer-whatsapp-action{min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;margin-left:4px;border:1px solid #bce6d2;border-radius:9px;background:#f1fbf6;color:#087a4d;font-size:11px;font-weight:900;white-space:nowrap;vertical-align:middle}
.customer-whatsapp-action i{font-size:15px}.customer-whatsapp-action:hover{background:#e2f7ec;border-color:#75caa0;transform:translateY(-1px)}

/* Compact regular-user sidebar without affecting admin spacing */
body.is-standard-user .sidebar nav{gap:0;padding-block:10px}
body.is-standard-user .sidebar nav a{min-height:39px;padding:7px 13px;margin:0;font-size:12px;border-radius:10px}
body.is-standard-user .sidebar nav a i{font-size:14px}
body.is-standard-user .brand{padding-bottom:14px}
body.is-standard-user .logout{min-height:40px;padding-block:7px}

/* Personal account settings */
.account-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:1100px}
.account-setting-card{margin:0;padding:24px}.account-setting-title{display:flex;align-items:center;gap:13px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.account-setting-title>span{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:var(--pale);color:var(--red);font-size:18px}
.account-setting-title h2,.account-setting-title p{margin:0}.account-setting-title h2{font-size:18px}.account-setting-title p{margin-top:3px;color:var(--muted);font-size:11px;line-height:1.7}
.account-setting-card .crm-form label{font-size:13px}.account-setting-card .form-response:empty{display:none}

/* Product rows stay compact, but the text is comfortably readable */
.store-product-row-title h3{font-size:14.5px!important;line-height:1.55!important;font-weight:900!important}
.store-product-row-title p{font-size:10.5px!important;line-height:1.5!important}
.store-product-row-meta span,.store-product-row-meta small{font-size:9.5px!important}
.store-product-row-meta strong{font-size:11.5px!important;line-height:1.45!important}
.store-product-row-price strong{font-size:14px!important}.store-product-row-price del{font-size:9.5px!important}
.store-product-row-actions .btn{font-size:10.5px!important;font-weight:900!important}
.store-product-card,.store-product-row{min-height:0!important}

/* Customer file typography and shorter hero */
.customer-file-page{font-size:16px!important}
.customer-file-hero{padding:17px 20px!important;min-height:0!important;gap:18px!important}
.customer-file-identity{padding-block:0!important}.customer-back-link{font-size:12px!important;margin-bottom:9px!important}
.customer-name-line h1{font-size:32px!important;line-height:1.25!important}.customer-name-line .badge{font-size:12px!important}
.customer-meta-line{font-size:12.5px!important;gap:12px!important}.customer-flags .customer-flag{font-size:11px!important}
.customer-file-actions{gap:8px!important;align-self:center!important}.profile-action-card{min-height:66px!important;padding:11px 13px!important}
.profile-action-card>i{width:39px!important;height:39px!important;font-size:15px!important}.profile-action-card b{font-size:12.5px!important}.profile-action-card small{font-size:9.5px!important}
.customer-kpi-grid article small,.customer-insight-strip article small{font-size:11px!important}.customer-kpi-grid article strong{font-size:20px!important}.customer-kpi-grid article em{font-size:9.5px!important}
.customer-insight-strip article strong{font-size:12.5px!important}.customer-insight-strip article em{font-size:9px!important}
.customer-file-tabs button{font-size:12px!important}.profile-section-title h2{font-size:19px!important}.profile-section-title p{font-size:11.5px!important}
.customer-file-panels,.customer-file-panels p,.customer-file-panels strong,.customer-file-panels small{line-height:1.75}
.customer-file-panels p{font-size:12.5px}.customer-file-panels strong{font-size:13.5px}.customer-file-panels small{font-size:10.5px}
.profile-side-card h2{font-size:16px!important}.profile-side-card p{font-size:10.5px!important}.profile-side-card dt{font-size:11px!important}.profile-side-card dd{font-size:12px!important;font-weight:800}
.customer-basic-delete{margin-top:15px;min-height:40px;font-size:11px}

/* Professional notes and attachment experience */
.professional-notes-files{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)!important;gap:20px!important;align-items:start}
.notes-professional-panel,.files-professional-panel{border:1px solid var(--border);border-radius:18px;padding:18px;background:#fff;min-width:0}
.attachments-count{padding:5px 10px;border-radius:999px;background:var(--pale);color:var(--red);font-size:10px;font-weight:900;white-space:nowrap}
.customer-attachment-uploader,.quick-upload-section{padding:14px;border:1px dashed #dcbfc2;border-radius:15px;background:#fffafa;margin-bottom:16px}
.quick-upload-section{margin:0 0 17px}.quick-upload-section .section-heading{margin-bottom:11px}
.customer-upload-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.customer-upload-tile{position:relative!important;display:flex!important;align-items:center!important;gap:11px!important;min-height:74px;margin:0!important;padding:12px!important;border:1px solid var(--border);border-radius:13px;background:#fff;cursor:pointer;transition:.2s}
.customer-upload-tile:hover{border-color:#d99a9f;box-shadow:0 7px 20px rgba(67,0,6,.06);transform:translateY(-1px)}
.customer-upload-tile input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important;z-index:2}
.customer-upload-tile>i{width:42px;height:42px;display:grid;place-items:center;flex:0 0 42px;border-radius:12px;background:var(--pale);color:var(--red);font-size:17px}
.customer-upload-tile.camera>i{background:#edf8f3;color:#087a4d}.customer-upload-tile span{display:grid;gap:2px;min-width:0}.customer-upload-tile b{font-size:12px}.customer-upload-tile small{font-size:9px!important;color:var(--muted)}
.selected-file-summary{margin:10px 0;padding:8px 10px;border-radius:9px;background:#fff;color:var(--muted);font-size:9.5px;line-height:1.7;overflow-wrap:anywhere}.selected-file-summary.has-files{background:#edf8f3;color:#087a4d;font-weight:800}
.customer-attachment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.customer-attachment-card{display:grid;grid-template-columns:82px minmax(0,1fr);gap:11px;padding:10px;border:1px solid var(--border);border-radius:14px;background:#fff;min-width:0;transition:.2s}
.customer-attachment-card:hover{border-color:#d9b8bb;box-shadow:0 9px 24px rgba(67,0,6,.06)}
.attachment-preview{width:82px;height:82px;border-radius:11px;overflow:hidden;display:grid;place-items:center;background:var(--pale);color:var(--red)}
.attachment-preview img{width:100%;height:100%;object-fit:cover;display:block}.attachment-preview i{font-size:29px}
.attachment-info{display:flex;flex-direction:column;min-width:0}.attachment-info>strong{font-size:11.5px!important;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.attachment-info>small{font-size:8.7px!important;color:var(--muted);line-height:1.5}
.attachment-actions{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:6px}.attachment-actions .btn{min-height:31px;padding:4px 8px;font-size:9px}.attachment-actions .icon-btn{width:31px;height:31px;margin:0}
.attachment-empty{grid-column:1/-1}.customer-notes-list article{padding:14px!important;border-radius:13px!important}.customer-notes-list article p{font-size:12.5px!important}

/* Activity cap notice */
.activity-toolbar-v211 small{line-height:1.7}.activity-clear-form-v211 select[name="scope"]{font-weight:800}

/* Public QR form must never disappear at narrow widths */
html:has(body.public-register-page){min-width:0!important;overflow-x:hidden!important}
body.public-register-page{display:block!important;visibility:visible!important;opacity:1!important;min-width:0!important;width:100%!important;overflow-x:hidden!important}
.public-register-shell,.public-register-card,.public-register-brand,.public-customer-form{visibility:visible!important;opacity:1!important;transform:none!important;max-width:100%!important}

@media(max-width:1000px){.account-settings-grid{grid-template-columns:1fr}.professional-notes-files{grid-template-columns:1fr!important}.customer-attachment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
 .customer-file-page{font-size:15px!important}.customer-file-hero{padding:14px!important}.customer-name-line h1{font-size:25px!important}.customer-file-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}.profile-action-card{min-height:62px!important}
 .customer-upload-options,.customer-attachment-grid{grid-template-columns:1fr}.customer-upload-tile{min-height:68px}.customer-attachment-card{grid-template-columns:72px minmax(0,1fr)}.attachment-preview{width:72px;height:72px}
 .account-setting-card{padding:17px}.customer-whatsapp-action{padding-inline:9px}
}
@media(max-width:520px){
 body.public-register-page{display:block!important;padding:9px!important}.public-register-shell{display:block!important;width:100%!important}.public-register-card{display:block!important;width:100%!important;padding:16px!important}.public-customer-form{display:block!important}.public-customer-form .form-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important}.public-customer-form input,.public-customer-form select,.public-customer-form textarea{font-size:16px!important}
 .customer-file-actions{grid-template-columns:1fr!important}.customer-attachment-card{grid-template-columns:64px minmax(0,1fr)}.attachment-preview{width:64px;height:64px}.customer-whatsapp-action span{display:inline}
}
.automatic-sync-card{display:grid;gap:13px;background:linear-gradient(135deg,#fff,#fff7f7);border-color:#e0c3c6}
.automatic-sync-heading{display:flex;align-items:center;gap:13px}.automatic-sync-heading>span{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#eaf8f1;color:#087a4d;font-size:18px}.automatic-sync-heading h2,.automatic-sync-heading p{margin:0}.automatic-sync-heading h2{font-size:17px}.automatic-sync-heading p{margin-top:3px;color:var(--muted);font-size:11px;line-height:1.8}
.automatic-sync-card code{display:block;padding:12px 14px;border:1px solid var(--border);border-radius:11px;background:#2a2021;color:#fff;font-family:Consolas,monospace;font-size:11px;direction:ltr;text-align:left;overflow:auto;white-space:nowrap}.automatic-sync-card>small{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:9.5px}
.store-product-row-action .btn{font-size:10.5px!important;font-weight:900!important}.store-product-sync-time{font-size:10px!important;font-weight:800!important}

/* v2.0.15 — compact staff sidebar and formal customer case register */
@media (min-width:901px){
 body.is-standard-user .sidebar nav{justify-content:flex-start!important;align-content:flex-start!important;gap:4px!important;overflow-y:auto!important;padding-block:10px!important}
 body.is-standard-user .sidebar nav a{flex:0 0 auto!important;width:100%;min-height:42px!important;padding:9px 13px!important;font-size:13px!important}
 body.is-standard-user .sidebar .logout{margin-top:auto!important}
}

.customer-cases-page{display:grid;gap:18px;min-width:0}.customer-cases-head{align-items:flex-end}.customer-case-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.customer-case-stats article{min-height:112px;display:grid;grid-template-columns:43px minmax(0,1fr);align-items:center;gap:11px;padding:17px;background:#fff;border:1px solid var(--border);border-radius:17px;box-shadow:0 9px 25px rgba(67,0,6,.04)}.customer-case-stats i{width:43px;height:43px;display:grid;place-items:center;color:var(--red);background:var(--pale);border-radius:13px}.customer-case-stats span{color:var(--muted);font-size:11px;font-weight:800}.customer-case-stats strong{font-size:25px;line-height:1.2}
.customer-case-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.customer-case-type-card{min-width:0;min-height:112px;display:grid;grid-template-columns:48px minmax(0,1fr) 24px;align-items:center;gap:12px;padding:16px;background:#fff;border:1px solid var(--border);border-radius:17px;box-shadow:0 8px 22px rgba(67,0,6,.035);transition:.18s}.customer-case-type-card:hover,.customer-case-type-card.active{transform:translateY(-2px);border-color:color-mix(in srgb,var(--case-color) 42%,white);box-shadow:0 14px 30px rgba(67,0,6,.08)}.customer-case-type-card>span{width:48px;height:48px;display:grid;place-items:center;color:var(--case-color);background:color-mix(in srgb,var(--case-color) 10%,white);border-radius:14px;font-size:18px}.customer-case-type-card>div{min-width:0}.customer-case-type-card strong,.customer-case-type-card p{margin:0}.customer-case-type-card strong{font-size:13px}.customer-case-type-card p{margin-top:4px;color:var(--muted);font-size:9.5px;line-height:1.75}.customer-case-type-card>i{color:#9b8589}.customer-case-type-card.add-type{--case-color:#7a6266;border-style:dashed;background:#fffafa}
.customer-case-filters{padding:17px}.customer-case-filter-form{grid-template-columns:minmax(260px,2fr) repeat(4,minmax(145px,1fr))}.customer-case-list-panel{padding:0!important;overflow:hidden}.customer-case-list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid var(--border);background:#fffafa}.customer-case-list-head h2,.customer-case-list-head p{margin:0}.customer-case-list-head h2{font-size:17px}.customer-case-list-head p{margin-top:3px;color:var(--muted);font-size:10px}.customer-case-list{display:grid}.customer-case-record{display:grid;grid-template-columns:52px minmax(0,1fr) 175px;gap:14px;align-items:start;padding:17px 20px;border-bottom:1px solid var(--border);background:#fff}.customer-case-record:last-child{border-bottom:0}.customer-case-record:hover{background:#fffafa}.customer-case-record.resolved{opacity:.72}.case-record-icon{width:48px;height:48px;display:grid;place-items:center;color:var(--case-color);background:color-mix(in srgb,var(--case-color) 10%,white);border-radius:14px;font-size:18px}.case-record-main{min-width:0}.case-record-main header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.case-record-main header>div{display:flex;align-items:center;flex-wrap:wrap;gap:7px}.case-type-badge,.repeat-badge,.case-status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:9px;font-weight:900}.case-type-badge{color:var(--case-color);background:color-mix(in srgb,var(--case-color) 9%,white)}.repeat-badge{color:#8a5a00;background:#fff1c9}.case-status.active{color:#a4000b;background:#fee8ea}.case-status.resolved{color:#087a4d;background:#e8f8f0}.case-record-main h3{margin:8px 0 3px;font-size:16px}.case-contact-line{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;color:var(--muted);font-size:10px}.case-contact-line span{display:inline-flex;align-items:center;gap:6px}.case-contact-line i{color:#9b7479}.case-record-main p{margin:10px 0 7px;color:#5e464a;font-size:11.5px;line-height:1.85}.case-record-main>small{color:var(--muted);font-size:9px}.case-record-actions{display:grid;align-content:center;gap:7px}.case-record-actions form{margin:0}.case-record-actions .btn{width:100%}.case-record-actions .icon-btn{justify-self:end}.customer-case-empty{margin:20px}.customer-case-modal .page-modal-card{width:min(94vw,760px);max-height:92vh;border-top-left-radius:38px;border-bottom-left-radius:38px;overflow:hidden}.customer-case-modal .page-modal-card.compact{width:min(94vw,580px)}.customer-case-modal .page-modal-body{max-height:92vh;overflow-y:auto;padding:25px 34px 28px 40px;scrollbar-gutter:stable}.customer-case-form textarea{min-height:105px}
.customer-case-warning{margin:12px 0;padding:13px;border:1px solid #e9a6ac;border-radius:15px;background:linear-gradient(135deg,#fff7f7,#fff);box-shadow:0 10px 25px rgba(120,0,1,.06)}.customer-case-warning.loading{display:flex;align-items:center;gap:9px;color:var(--muted)}.customer-case-warning-head{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px}.customer-case-warning-head>span{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#fee8ea;color:#a4000b}.customer-case-warning-head strong,.customer-case-warning-head p{margin:0}.customer-case-warning-head strong{font-size:12.5px;color:#8f000a}.customer-case-warning-head p{margin-top:3px;color:#765d61;font-size:9px;line-height:1.7}.customer-case-warning-head>b{min-width:28px;height:28px;display:grid;place-items:center;padding:0 8px;border-radius:999px;background:#a4000b;color:#fff;font-size:10px}.customer-case-warning-list{display:grid;gap:7px;margin-top:10px}.customer-case-warning-list article{display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;padding:9px 10px;border:1px solid color-mix(in srgb,var(--case-color) 20%,white);border-radius:11px;background:#fff}.customer-case-warning-list article>i{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;color:var(--case-color);background:color-mix(in srgb,var(--case-color) 10%,white)}.customer-case-warning-list strong,.customer-case-warning-list p,.customer-case-warning-list small{display:block;margin:0}.customer-case-warning-list strong{font-size:10.5px}.customer-case-warning-list p{margin-top:2px;color:#634b4f;font-size:9.5px;line-height:1.7}.customer-case-warning-list small{margin-top:3px;color:var(--muted);font-size:8px}.customer-case-warning>a{display:inline-flex;align-items:center;gap:6px;margin-top:9px;color:var(--red);font-size:9.5px;font-weight:900}

@media(max-width:1150px){.customer-case-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-case-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-case-filter-form .filter-search{grid-column:1/-1}.customer-case-record{grid-template-columns:48px minmax(0,1fr)}.case-record-actions{grid-column:2;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));align-items:center}.case-record-actions .icon-btn{justify-self:start}}
@media(max-width:720px){.customer-case-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-case-type-grid{grid-template-columns:1fr}.customer-case-filter-form{grid-template-columns:1fr}.customer-case-filter-form .filter-search{grid-column:auto}.customer-case-record{grid-template-columns:42px minmax(0,1fr);padding:14px}.case-record-icon{width:42px;height:42px}.case-record-actions{grid-template-columns:1fr 1fr}.customer-case-modal .page-modal-card{width:100%;max-height:94vh;align-self:end;border-radius:20px 20px 0 0}.customer-case-modal .page-modal-body{padding:20px 17px}.customer-case-warning-head{grid-template-columns:38px minmax(0,1fr)}.customer-case-warning-head>b{grid-column:1/-1;justify-self:start}.customer-cases-head{align-items:flex-start}.customer-cases-head .page-head-actions{width:100%;justify-content:stretch}.customer-cases-head .page-head-actions .btn{flex:1}}


/* v2.0.16 — customer segmentation, refined exports and calmer user modal */
.customer-source-tabs{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap;margin:-2px 0 16px}.customer-source-tabs a{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 17px;border:1px solid var(--border);border-radius:15px;background:#fff;color:#6f5c60;font-size:12px;font-weight:900;box-shadow:0 7px 20px rgba(67,0,6,.035);transition:.18s}.customer-source-tabs a:hover{transform:translateY(-1px);border-color:#d9b8bc;color:var(--red)}.customer-source-tabs a.active{background:linear-gradient(135deg,#c40001,#9d0001);border-color:#c40001;color:#fff;box-shadow:0 10px 25px rgba(196,0,1,.16)}
.customer-table-tools{align-items:center;gap:16px;flex-wrap:wrap}.customer-export-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.customer-export-actions .customer-print-btn{margin-inline-start:8px;border-color:#e7c3c7;background:#fff7f7;color:#8d0001}.customer-export-actions .customer-print-btn:hover{background:#c40001;color:#fff}.customer-origin-badges{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:5px}.origin-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 7px;border-radius:999px;font-size:8.5px;font-weight:900;line-height:1.2}.origin-badge.qr{color:#6630a3;background:#f1e8ff}.origin-badge.store{color:#8a5700;background:#fff1d5}.origin-badge.branch{color:#176541;background:#e8f7ef}.customer-row-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.customer-whatsapp-action{min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border:1px solid #b7dfca;border-radius:10px;background:#edf9f3;color:#087a4d;font-size:9.5px;font-weight:900}.customer-whatsapp-action:hover{background:#087a4d;color:#fff}.customers-table-v216 td>strong{font-size:12.5px}.customers-table-v216 td>small{display:block;margin-top:3px;color:var(--muted);font-size:8.5px}

.modal-card:has(.user-form){background:#fff!important;border:1px solid #eadedf!important;box-shadow:0 24px 70px rgba(44,26,29,.18)!important}.modal-card:has(.user-form) .modal-heading{margin:-26px -34px 22px -42px!important;padding:24px 34px 21px 42px!important;background:linear-gradient(135deg,#fffafa,#f7f1f2)!important;border-bottom:1px solid #eadedf!important}.modal-card:has(.user-form) .modal-heading>span{background:#f2e5e7!important;color:#8d2834!important;box-shadow:none!important}.modal-card:has(.user-form) .modal-heading h2{color:#2c2224!important}.modal-card:has(.user-form) .modal-heading p{color:#786b6d!important}.modal-card:has(.user-form) .permission-group{border-color:#eadedf!important;background:#fcfafa!important}.modal-card:has(.user-form) .permission-group legend{color:#443639!important}.modal-card:has(.user-form) .permission-group label{background:#fff!important;border-color:#eadedf!important;color:#4c3c3f!important}.modal-card:has(.user-form) .permission-group label:has(input:checked){background:#edf9f3!important;border-color:#b6dfc8!important;color:#087a4d!important}.modal-card:has(.user-form) .permissions-toolbar .btn{background:#fff!important;color:#7a4a51!important;border-color:#dfc8cb!important}.modal-card:has(.user-form) .user-form-submit{background:linear-gradient(135deg,#c40001,#9c0001)!important}

@media(max-width:760px){.customer-source-tabs{display:grid;grid-template-columns:1fr}.customer-source-tabs a{width:100%}.customer-export-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.customer-export-actions .customer-print-btn{grid-column:1/-1;margin-inline-start:0}.customer-table-tools>strong{width:100%}.modal-card:has(.user-form) .modal-heading{margin:-22px -18px 20px -24px!important;padding:22px 18px 19px 24px!important}}

/* =========================================================
   Ghazalah CRM v2.0.17 — stable assets, customer alerts and sync polish
   ========================================================= */
html,body,button,input,select,textarea{font-family:"Cairo",Tahoma,Arial,sans-serif}

/* Cleaner customer-case cards */
.customer-case-record{position:relative;grid-template-columns:58px minmax(0,1fr) 185px;gap:17px;padding:20px 22px;border-inline-start:4px solid var(--case-color,#c40001);background:linear-gradient(110deg,#fff 0%,#fff 76%,#fff9f9 100%)}
.customer-case-record:hover{background:linear-gradient(110deg,#fff 0%,#fffafa 100%);box-shadow:inset 0 0 0 1px #f1dfe1}
.case-record-icon{width:54px;height:54px;border-radius:17px;box-shadow:0 8px 20px color-mix(in srgb,var(--case-color) 12%,transparent)}
.case-record-main h3{font-size:17px;line-height:1.5;color:#241b1d}
.case-contact-line{margin-top:5px;font-size:11px;gap:9px 16px}
.case-address-line{display:flex;align-items:flex-start;gap:8px;margin-top:10px;padding:9px 11px;border-radius:11px;background:#f9f5f5;color:#5e4a4e;font-size:10.5px;line-height:1.7}
.case-address-line i{margin-top:4px;color:var(--case-color)}
.case-note-box{display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;align-items:start;margin:11px 0 8px;padding:12px 13px;border:1px solid #efdcde;border-radius:13px;background:#fffafa}
.case-note-box>i{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--case-color) 10%,white);color:var(--case-color)}
.case-note-box p{margin:0!important;font-size:12px!important;line-height:1.9!important;color:#4b383c!important}
.case-record-actions{padding-inline-start:12px;border-inline-start:1px dashed #ead8da}
.case-record-actions .btn{min-height:39px;border-radius:11px}

/* Important cases inside the customer file */
.customer-profile-cases-card{margin:18px 0;padding:0;border:1px solid #e9a4aa;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 14px 36px rgba(125,0,8,.08)}
.customer-profile-cases-card>header{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:14px;padding:19px 21px;background:linear-gradient(135deg,#fff5f6,#fff);border-bottom:1px solid #f0cdd1}
.customer-profile-cases-card .case-history-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#a6000b;color:#fff;font-size:21px;box-shadow:0 9px 22px rgba(166,0,11,.2)}
.customer-profile-cases-card header small,.customer-profile-cases-card header h2,.customer-profile-cases-card header p{margin:0}
.customer-profile-cases-card header small{color:#a6000b;font-size:10px;font-weight:900}
.customer-profile-cases-card header h2{margin-top:3px;font-size:19px;color:#321f22}
.customer-profile-cases-card header p{margin-top:4px;color:#765d61;font-size:11px;line-height:1.7}
.customer-profile-cases-card header>b{padding:8px 11px;border-radius:999px;background:#a6000b;color:#fff;font-size:11px}
.customer-profile-case-list{display:grid;gap:0}
.customer-profile-case-list article{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:15px 20px;border-bottom:1px solid #f0e0e2;background:#fff}
.customer-profile-case-list article:last-child{border-bottom:0}.customer-profile-case-list article.resolved{background:#fcfbfb;opacity:.82}
.customer-profile-case-list article>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:var(--case-color);background:color-mix(in srgb,var(--case-color) 10%,white);font-size:16px}
.customer-profile-case-list article>div>div{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.customer-profile-case-list strong{font-size:14px}.customer-profile-case-list em{padding:4px 8px;border-radius:999px;background:#fee8ea;color:#99000a;font-size:9px;font-style:normal;font-weight:900}
.customer-profile-case-list .resolved em{background:#e8f7ef;color:#087a4d}
.customer-profile-case-list p{margin:7px 0 5px;font-size:12px;line-height:1.9;color:#503c40}.customer-profile-case-list small{color:#877377;font-size:9.5px}
.customer-profile-cases-card>a{margin:0 20px 18px}

/* Discount history and manual customer discount */
.customer-discount-history-card{margin:18px 0;padding:20px;border:1px solid #eadedf;border-radius:21px;background:#fff;box-shadow:0 10px 28px rgba(67,0,6,.045)}
.customer-discount-history-card .profile-section-title>strong{font-size:18px;color:#8f0001}
.customer-discount-history-list{display:grid;gap:10px}.customer-discount-history-list article{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid #eee1e2;border-radius:14px;background:#fffafa}
.customer-discount-history-list article>span{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#fff;color:#9b0001;font-size:16px}.customer-discount-history-list article.store>span{color:#9a5b00;background:#fff6dd}.customer-discount-history-list article.manual>span{color:#087a4d;background:#eaf8f1}
.customer-discount-history-list strong,.customer-discount-history-list p,.customer-discount-history-list small{display:block;margin:0}.customer-discount-history-list p{margin-top:3px;color:#6e585c;font-size:10.5px}.customer-discount-history-list small{margin-top:3px;color:#8a777a;font-size:9px}.customer-discount-history-list article>b{color:#8f0001;font-size:14px;white-space:nowrap}
.customer-discount-entry{grid-column:1/-1;padding:15px;border:1px solid #ead8da;border-radius:16px;background:#fffafa}.customer-discount-entry .main-toggle{margin:0}.customer-discount-fields{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(260px,1.3fr);gap:12px;margin-top:13px}.customer-discount-fields[hidden]{display:none!important}
.customer-insight-strip-three{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Stronger origin badges when a customer belongs to more than one channel */
.customer-origin-badges{gap:6px}.origin-badge{font-size:9px;padding:5px 8px}.origin-badge.store{border:1px solid #efd397}.origin-badge.branch{border:1px solid #bde2cd}.origin-badge.qr{border:1px solid #d9c3f3}

/* Sync status messages remain readable even when a single order is skipped */
.sync-log-message{white-space:normal;line-height:1.75;overflow-wrap:anywhere}

@media(max-width:900px){.customer-case-record{grid-template-columns:50px minmax(0,1fr)}.case-record-actions{grid-column:2;padding-inline-start:0;border-inline-start:0;grid-template-columns:repeat(2,minmax(0,1fr))}.customer-insight-strip-three{grid-template-columns:1fr}.customer-profile-cases-card>header{grid-template-columns:50px minmax(0,1fr)}.customer-profile-cases-card header>b{grid-column:1/-1;justify-self:start}.customer-discount-fields{grid-template-columns:1fr}}
@media(max-width:620px){.customer-case-record{padding:15px 13px;border-inline-start-width:3px}.case-record-actions{grid-template-columns:1fr}.customer-profile-case-list article{padding:13px}.customer-profile-cases-card>header{padding:16px 14px}.customer-discount-history-card{padding:14px}.customer-discount-history-list article{grid-template-columns:40px minmax(0,1fr)}.customer-discount-history-list article>b{grid-column:2}.customer-profile-cases-card header h2{font-size:16px}}


/* =========================================================
   Ghazalah CRM v2.0.18 — unified customers and readable live reports
   ========================================================= */
.customer-source-tabs{display:none!important}.customers-unified-head{margin-bottom:18px}.customers-unified-head h1{font-size:30px}.customer-table-tools>strong{font-size:16px;color:var(--dark)}
.report-period-filter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px;padding:8px;background:#fff;border:1px solid var(--border);border-radius:17px;box-shadow:0 8px 24px rgba(67,0,6,.04)}
.report-period-filter a{min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 12px;border-radius:12px;color:#6f5d60;font-size:12px;font-weight:900}.report-period-filter a:hover{background:#fff5f5;color:var(--red)}.report-period-filter a.active{background:linear-gradient(135deg,var(--red),var(--dark));color:#fff;box-shadow:0 8px 18px rgba(120,0,1,.18)}
.customer-pulse-panel{min-width:0}.live-chart-scroll{overflow-x:auto;overflow-y:hidden;padding-bottom:5px}.customer-count-chart{min-width:840px;height:360px;padding:0}.customer-count-chart svg{height:360px;min-width:840px}.customer-chart-grid line{stroke:#eadedf;stroke-width:1}.customer-chart-grid text{fill:#69575a;font-family:Cairo,Arial,sans-serif;font-size:12px;font-weight:800}.customer-chart-x-axis line{stroke:#bcaeb0;stroke-width:1.2}.customer-chart-x-axis text{fill:#69575a;font-family:Cairo,Arial,sans-serif;font-size:10px;font-weight:800}.live-chart-point.capped circle{stroke:#ffb000;stroke-width:3}.chart-legend-row{display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding:12px 3px 2px;color:var(--muted);font-size:10px;font-weight:800}.chart-legend-row span{display:inline-flex;align-items:center;gap:6px}.legend-line{width:28px;height:3px;border-radius:999px;background:var(--red);box-shadow:0 0 9px rgba(196,0,1,.4)}
/* The QR page is meant to be readable from a distance at the counter. */
.qr-customers-page .page-head h1{font-size:38px!important;line-height:1.35}.qr-customers-page .page-head p{font-size:17px!important;line-height:1.9}.qr-customers-page .eyebrow{font-size:14px!important}.qr-display-panel h2{font-size:32px!important;line-height:1.5}.qr-display-panel>p{font-size:18px!important;line-height:1.8}.qr-live-badge{font-size:14px!important}.qr-workflow-card h2{font-size:24px!important}.qr-workflow-card .panel-head p{font-size:14px!important}.qr-workflow-card li strong{font-size:17px!important}.qr-workflow-card li p{font-size:13px!important;line-height:1.8}.qr-security-card strong,.qr-use-cases h3{font-size:18px!important}.qr-security-card p,.qr-use-cases span{font-size:13px!important}
@media(max-width:760px){.report-period-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.report-period-filter a{font-size:11px}.customers-unified-head h1{font-size:26px}.qr-customers-page .page-head h1{font-size:31px!important}.qr-customers-page .page-head p{font-size:15px!important}.qr-display-panel h2{font-size:27px!important}.qr-display-panel>p{font-size:16px!important}}


/* =========================================================
   Ghazalah CRM v2.0.19 — controllable QR and day-by-day sales pulse
   ========================================================= */
.qr-link-manager{display:grid;gap:10px;margin-top:20px}.qr-link-manager>label{display:grid;gap:8px;text-align:start}.qr-link-manager>label>span{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:900;color:#3f292d}.qr-link-manager>label>span i{color:var(--red)}.qr-link-manager .qr-link-box input:not([readonly]){background:#fff;border-color:#d9aeb2;box-shadow:0 0 0 3px rgba(196,0,1,.035)}.qr-link-help{color:var(--muted);font-size:11px;line-height:1.8;text-align:start}.qr-link-manager .form-response:empty{display:none}.qr-primary-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.qr-primary-actions .btn{min-height:46px}
.customer-count-chart{position:relative;height:380px!important}.customer-count-chart svg{height:380px!important}.sales-revenue-axis text{fill:#9b000a;font-family:Cairo,Arial,sans-serif;font-size:10px;font-weight:900}.customer-day-bar{fill:url(#customerBarGradient);transition:opacity .18s,filter .18s}.customer-day-bar:hover{filter:brightness(.92)}.customer-day-bar.future,.live-chart-point.future{opacity:.3}.live-chart-point{cursor:pointer;outline:none}.live-chart-point:focus circle,.live-chart-point:hover circle{r:7;fill:#fff3f4;stroke-width:4}.live-chart-tooltip{position:fixed;z-index:8;min-width:245px;max-width:290px;padding:14px 15px;border:1px solid #e2b8bd;border-radius:16px;background:rgba(255,255,255,.98);box-shadow:0 18px 45px rgba(70,0,7,.16);transform:translate(-50%,-100%);direction:rtl;text-align:right;pointer-events:none}.live-chart-tooltip::after{content:"";position:absolute;left:50%;bottom:-8px;width:14px;height:14px;background:#fff;border-inline-end:1px solid #e2b8bd;border-bottom:1px solid #e2b8bd;transform:translateX(-50%) rotate(45deg)}.live-chart-tooltip strong{display:block;margin-bottom:8px;color:#2d1f22;font-size:14px}.live-chart-tooltip>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:6px 0;border-top:1px dashed #eee0e2;font-size:11px}.live-chart-tooltip>div span{display:inline-flex;align-items:center;gap:7px;color:#715c60}.live-chart-tooltip>div i{width:16px;color:var(--red);text-align:center}.live-chart-tooltip>div b{color:#2e2023;white-space:nowrap}.live-chart-tooltip small{display:block;margin-top:7px;padding:7px 8px;border-radius:9px;background:#fff5f5;color:#7f555b;font-size:9.5px;line-height:1.6}.legend-bar{width:12px;height:17px;border-radius:4px;background:linear-gradient(#d9a5aa,#f7e7e9);border:1px solid #e2c3c6}.customer-chart-x-axis text{font-size:10.5px!important}.live-sales-line{stroke-width:4.5}.live-sales-area{opacity:.95}
@media(max-width:760px){.qr-primary-actions{grid-template-columns:1fr}.live-chart-tooltip{min-width:220px;max-width:250px}.customer-count-chart{height:350px!important}.customer-count-chart svg{height:350px!important}}
.live-chart-tooltip.below{transform:translate(-50%,0)}.live-chart-tooltip.below::after{top:-8px;bottom:auto;border:0;border-inline-start:1px solid #e2b8bd;border-top:1px solid #e2b8bd}

/* =========================================================
   Ghazalah CRM v2.0.20 — customers pagination up to 10,000
   ========================================================= */
.customer-pagination-v220{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:14px;padding:14px 16px;border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(67,0,6,.04)}
.customer-pagination-summary-v220{display:grid;gap:5px;min-width:220px}.customer-pagination-summary-v220>strong{font-size:12px;color:var(--dark)}.customer-cap-note-v220{display:flex;align-items:center;gap:6px;color:#8b676d;font-size:9px;line-height:1.7}.customer-cap-note-v220 i{color:var(--red)}
.customer-pagination-actions-v220{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.customer-pagination-actions-v220>label{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px;font-weight:800}.customer-pagination-actions-v220 select{min-height:38px;padding:5px 30px 5px 9px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--dark);font-size:11px;font-weight:900;outline:0}.customer-pagination-actions-v220 select:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--pink)}
.customer-pagination-actions-v220 nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.customer-pagination-actions-v220 button{min-width:38px;height:38px;padding:0 10px;border:1px solid var(--border);border-radius:10px;background:#fff;color:#5f4c50;font-size:10px;font-weight:900;transition:.18s}.customer-pagination-actions-v220 button:hover{border-color:#d8aaae;color:var(--red);transform:translateY(-1px)}.customer-pagination-actions-v220 button.active{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 7px 16px rgba(196,0,1,.16)}
.customers-table-v220 td,.customers-table-v220 th{white-space:nowrap}.customers-table-v220 td:first-child,.customers-table-v220 th:first-child{white-space:normal;min-width:170px}
@media(max-width:760px){.customer-pagination-v220{align-items:stretch;padding:12px}.customer-pagination-summary-v220{width:100%}.customer-pagination-actions-v220{width:100%;display:grid;grid-template-columns:1fr}.customer-pagination-actions-v220>label{justify-content:space-between}.customer-pagination-actions-v220 nav{justify-content:center}.customer-pagination-actions-v220 button{flex:1;min-width:42px}.customers-table-v220 td,.customers-table-v220 th{white-space:normal}}