/* quote rocket specific */
:root {
    --qr-color-primary: #1f3bb3;
    --qr-color-primary-strong: #1e283d;
    --qr-color-link: #2f57c8;
    --qr-color-link-hover: #1a3ea8;
    --qr-surface-page: #f4f5f7;
    --qr-surface-card: #ffffff;
    --qr-surface-subtle: #f8f9fb;
    --qr-text-default: #1f1f1f;
    --qr-text-muted: #5f6b7a;
    --qr-text-on-primary: #ffffff;
    --qr-border-default: #d9dde3;
    --qr-border-subtle: #e8ecf2;
    --qr-danger: #9e1c1c;
    --qr-danger-strong: #c62828;
    --bs-primary: var(--qr-color-primary);
    --bs-dark: var(--qr-color-primary-strong);
    --bs-link-color: var(--qr-color-link);
    --bs-link-hover-color: var(--qr-color-link-hover);
}

body {
    color: var(--qr-text-default);
}

p {
    line-height: 1.45;
}

.text-muted,
.small.text-muted {
    color: var(--qr-text-muted) !important;
}
/* Show div on desktop (screens wider than 768px) */
@media only screen and (min-width: 768px) {
    .desktop-only {
        display: block; /* or other display type like flex, grid */
    }
}

/* Hide div on mobile (screens narrower than 768px) */
@media only screen and (max-width: 767px) {
    .desktop-only {
        display: none;
    }
}

/* Show div on mobile (screens narrower than 768px) */
@media only screen and (max-width: 767px) {
    .mobile-only {
        display: block; /* or other display type like flex, grid */
    }
}

/* Hide div on desktop (screens wider than 768px) */
@media only screen and (min-width: 768px) {
    .mobile-only {
        display: none;
    }
}

.user-profile-pic-round {
    border-radius: 5px;
    width: 50px;
    height: 50px;
}

.subscriber_logo img.subscriber-logo-small {
    border-radius: 0px;
    width: 100px;
    height: auto;
}

.subscriber-logo-medium {
    border-radius: 0px;
    width: 200px;
    height: auto;
    /*height: 50px;*/
}

.textarea-soft {
    width: 100%;
    min-height: 150px;
    padding: 12px 20px;
    box-sizing: border-box;
    border: 1px solid var(--qr-border-default);
    border-radius: 8px;
    background: var(--qr-surface-card);
}

.textarea-soft:focus-visible {
    border-color: var(--qr-color-primary);
    box-shadow: 0 0 0 0.25rem rgba(31, 59, 179, 0.2);
    outline: 0;
}

/* ===== Button system-wide overrides ===== */
/* Keep default Bootstrap width behavior and opt into fit-content explicitly. */
.btn {
    width: auto;
}

.qr-btn-fit {
    width: fit-content !important;
}

.qr-btn-block {
    width: 100% !important;
}
.btn-group-vertical > .btn {
    width: 100% !important; /* vertical groups keep full width */
}

/* Filled/solid buttons: white text for consistency */
.btn-primary, .btn-secondary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-dark, .btn-purple {
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-color: #fff;
    --bs-btn-disabled-color: #fff;
    color: #fff !important;
}

/* Alias for typo used in templates: btn-otline-dark -> same as btn-outline-dark */
.btn-otline-dark {
    --bs-btn-color: var(--qr-color-primary-strong);
    --bs-btn-border-color: var(--qr-color-primary-strong);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--qr-color-primary-strong);
    --bs-btn-hover-border-color: var(--qr-color-primary-strong);
    border: 1px solid var(--qr-color-primary-strong);
    color: var(--qr-color-primary-strong);
}
.btn-otline-dark:hover {
    background: var(--qr-color-primary-strong);
    color: #ffffff;
}

.qr-data-list {
    border: 1px solid var(--qr-border-subtle);
    border-radius: 12px;
    background: var(--qr-surface-card);
    overflow: hidden;
}

.qr-data-list-header {
    background: var(--qr-surface-subtle);
    border-bottom: 1px solid var(--qr-border-subtle);
    padding: 0.75rem 1rem;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--qr-text-muted);
}

.qr-data-row {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--qr-border-subtle);
}

.qr-data-row:last-child {
    border-bottom: 0;
}

.qr-data-row h6,
.qr-data-row p {
    margin-bottom: 0.35rem;
}

.qr-data-row-meta {
    color: var(--qr-text-muted);
    font-size: 0.82rem;
}

.qr-empty-state {
    border: 1px dashed var(--qr-border-default);
    border-radius: 10px;
    padding: 1rem;
    color: var(--qr-text-muted);
    background: #fcfdff;
}

.qr-feedback-box {
    border: 1px solid var(--qr-border-subtle);
    border-radius: 10px;
    background: var(--qr-surface-subtle);
    padding: 0.75rem;
}

.qr-feedback-box.qr-feedback-muted {
    color: var(--qr-text-muted);
}

.qr-js-hidden {
    display: none;
}

.qr-pagination {
    margin-top: 0.75rem;
}

/* ===== CRM workspace friendly refresh ===== */
.workspace-hero-panel {
    border: 1px solid var(--qr-border-subtle);
    border-radius: 12px;
    background: linear-gradient(180deg, #f8faff 0%, #ffffff 75%);
    padding: 0.9rem 1rem;
}

.workspace-hero-subtitle {
    font-size: 0.92rem;
    color: var(--qr-text-muted);
}

.workspace-hero-microcopy {
    font-size: 0.84rem;
    color: var(--qr-text-muted);
}

.workspace-filter-panel {
    border: 1px solid var(--qr-border-subtle);
    border-radius: 12px;
    background: var(--qr-surface-card);
    padding: 0.9rem;
}

.workspace-quick-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.workspace-quick-chips-label {
    color: var(--qr-text-muted);
    font-size: 0.8rem;
    font-weight: 600;
}

.workspace-quick-chip.is-active {
    background: var(--qr-color-primary);
    border-color: var(--qr-color-primary);
    color: #fff;
}

.workspace-filter-meta {
    min-height: 1.3rem;
}

.workspace-advanced-inner {
    border-top: 1px dashed var(--qr-border-default);
    padding-top: 0.8rem;
}

.workspace-results-shell {
    border: 1px solid var(--qr-border-subtle);
    border-radius: 10px;
    padding: 0.75rem;
    background: #fcfdff;
}

.workspace-loading-block {
    display: block;
    height: 0.8rem;
    border-radius: 10px;
    margin-bottom: 0.5rem;
    background: linear-gradient(90deg, #eef2f8 0%, #f8fafe 40%, #eef2f8 100%);
    background-size: 240px 100%;
    animation: workspaceShimmer 1.2s linear infinite;
}

@keyframes workspaceShimmer {
    0% { background-position: 240px 0; }
    100% { background-position: -240px 0; }
}

@media only screen and (max-width: 767px) {
    .workspace-filter-panel {
        padding: 0.75rem;
    }

    .workspace-hero-panel {
        padding: 0.75rem;
    }
}

/* ===== Quotes Action column ===== */
.quote-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    position: relative;
}
.quote-action-btn,
.quote-action-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 6px;
    border-radius: 4px;
    color: #405581;
    text-decoration: none;
    font-size: 14px;
    transition: background 0.15s, color 0.15s;
}
.quote-actions-primary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.quote-action-primary {
    border: 1px solid var(--qr-border-default);
    background: #ffffff;
    min-height: 32px;
}
.quote-action-primary span {
    margin-left: 4px;
    font-size: 12px;
}
.quote-action-btn:hover {
    background: #e8eaed;
    color: #1a5f7a;
}
.quote-actions-more {
    position: relative;
}
.quote-actions-more-toggle {
    border: 1px solid var(--qr-border-default);
    background: #f8f9fb;
    min-height: 32px;
}
.quote-actions-more-toggle span {
    margin-left: 4px;
    font-size: 12px;
}
.quote-actions-more-menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    width: 190px;
    background: #ffffff;
    border: 1px solid var(--qr-border-default);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(30, 40, 61, 0.18);
    z-index: 200;
    padding: 6px 0;
}
.quote-actions-more.is-open .quote-actions-more-menu {
    display: block;
}
.quote-more-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 10px;
    color: var(--qr-color-link);
    font-size: 13px;
    text-decoration: none;
    background: transparent;
    border: 0;
    line-height: 1.2;
}
.quote-more-item:hover {
    background: #eef2f7;
    color: #1a5f7a;
    text-decoration: none;
}
.quote-more-check {
    margin: 0;
    cursor: pointer;
}
.quote-more-check input {
    margin: 0 2px 0 0;
}
.quote-more-divider {
    height: 1px;
    margin: 4px 10px;
    background: var(--qr-border-subtle);
}
.quote-more-item.quote-action-delete {
    color: var(--qr-danger);
}
.quote-more-item.quote-action-delete:hover {
    background: #fde8e8;
    color: var(--qr-danger-strong);
}
.quote-action-btn.quote-action-delete:hover {
    background: #fde8e8;
    color: var(--qr-danger-strong);
}
.quote-action-btn.quote-action-uw {
    font-size: 11px;
    padding: 0 5px;
}
.quote-more-item.quote-action-uw {
    font-size: 12px;
}
.quote-action-label {
    cursor: pointer;
    margin: 0;
}
.quote-action-label:hover {
    background: #e8eaed;
    color: #1a5f7a;
}
.quote-action-label input {
    margin-right: 4px;
    vertical-align: middle;
}

/* ===== PEO Quote actions - 2 rows of 3 ===== */
.peo-quote-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.peo-quote-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
}
.peo-actions-col {
    width: 220px;
    min-width: 220px;
}
.peo-quote-actions-v2 {
    align-items: flex-start;
}
.peo-quote-actions-v2 .quote-actions-primary {
    gap: 3px;
}
.peo-quote-actions-v2 .quote-action-primary {
    min-width: 0;
    padding: 0 5px;
}
.peo-quote-actions-v2 .quote-action-primary span {
    font-size: 11px;
}
.peo-quote-actions-v2 .quote-actions-more-toggle {
    padding: 0 7px;
}
.peo-quote-actions-v2 .quote-actions-more-toggle span {
    font-size: 11px;
}
.peo-inline-check {
    margin: 0;
    cursor: pointer;
}
.peo-inline-check input {
    margin-right: 4px;
}

/* ===== Mobile form/list utilities ===== */
@media only screen and (max-width: 767px) {
    .qr-mobile-card-row {
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 10px 8px;
        margin-bottom: 10px;
    }
    .qr-note-form-row > [class*="col-"] {
        margin-bottom: 12px;
    }
    .qr-mobile-full-btn {
        width: 100% !important;
        justify-content: center;
    }
    .qr-quote-line-item {
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 8px 6px;
        margin-bottom: 10px;
    }
    .quote-actions {
        flex-wrap: wrap;
        align-items: stretch;
    }
    .quote-actions-primary {
        flex: 1 1 100%;
    }
    .quote-actions-more {
        flex: 1 1 100%;
    }
    .quote-actions .quote-action-btn {
        min-height: 34px;
        padding: 0 10px;
        border: 1px solid #d9dde3;
    }
    .quote-actions-more-toggle {
        width: 100%;
        justify-content: center;
    }
    .quote-actions-more-menu {
        left: 0;
        right: auto;
        width: 100%;
    }
    .peo-actions-col {
        width: auto;
        min-width: 0;
    }
}