/**
 * Homecare Business — global responsive layout & hover enhancements
 * Applied across admin, employee, and auth pages.
 */

:root {
    --hc-brand-teal: #40E0D0;
    --hc-brand-gold: #B59B66;
    --hc-brand-gradient: linear-gradient(135deg, #40E0D0 0%, #B59B66 100%);
    --hc-text-primary: #344767;
    --hc-text-muted: #67748e;
    --hc-shadow-sm: 0 2px 8px rgba(52, 71, 103, 0.08);
    --hc-shadow-md: 0 8px 24px rgba(52, 71, 103, 0.12);
    --hc-shadow-hover: 0 12px 28px rgba(64, 224, 208, 0.18);
    --hc-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --hc-radius: 0.75rem;
}

/* ─── Smooth transitions (respect reduced motion) ─── */
@media (prefers-reduced-motion: no-preference) {
    .btn,
    .card,
    .nav-link,
    .dropdown-item,
    .table tbody tr,
    .rounded-circle.btn,
    .sidenav .icon,
    a.text-info,
    .breadcrumb-item a,
    .navbar-main .nav-link,
    .form-control,
    .form-select,
    .badge,
    .list-group-item {
        transition: background-color var(--hc-transition),
                    color var(--hc-transition),
                    box-shadow var(--hc-transition),
                    transform var(--hc-transition),
                    border-color var(--hc-transition),
                    opacity var(--hc-transition);
    }
}

/* ─── Main layout responsiveness ─── */
.main-content {
    overflow-x: hidden;
}

@media (max-width: 1199.98px) {
    .main-content.position-relative.max-height-vh-100 {
        margin-left: 0 !important;
    }

    .navbar-main.navbar-expand-lg {
        margin-left: 0.75rem !important;
        margin-right: 0.75rem !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    #content-wrapper {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
}

@media (max-width: 767.98px) {
    .navbar-main .breadcrumb {
        flex-wrap: wrap;
    }

    .navbar-main #navsubtitle {
        font-size: 0.95rem;
        word-break: break-word;
    }

    .container-fluid.py-4 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .card .card-header h5,
    .card .card-header h6 {
        font-size: 1rem;
        width: 100%;
    }

    .row.g-3 > [class*="col-"],
    .row > [class*="col-md-"],
    .row > [class*="col-lg-"] {
        margin-bottom: 0.5rem;
    }

    /* Dashboard stat cards */
    .card .icon.icon-lg.icon-shape.position-absolute {
        position: relative !important;
        margin-top: 0.5rem;
        right: auto !important;
        top: auto !important;
    }

    /* Modals */
    .modal-dialog {
        margin: 0.75rem;
        max-width: calc(100% - 1.5rem);
    }

    /* DataTable search / pagination */
    .dataTable-top,
    .dataTable-bottom {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .dataTable-input,
    .dataTable-selector {
        max-width: 100%;
    }

    /* Filter bars */
    .d-flex.flex-wrap,
    .card-header .d-flex,
    .card-body > .d-flex {
        gap: 0.5rem;
    }

    /* Form action rows */
    .text-end .btn,
    .d-flex.justify-content-end .btn {
        width: auto;
        min-width: 0;
    }

    /* Multistep forms */
    .multisteps-form__progress {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
    }

    /* Auth login */
    .page-header .ms-5.mt-2.w-10 {
        margin-left: 1rem !important;
        max-width: 80%;
        height: auto;
    }

    .page-header .col-md-6.col-lg-5 {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
}

@media (max-width: 575.98px) {
    .sidenav .navbar-brand-img {
        max-height: 4rem !important;
    }

    .card-header.d-flex .ms-auto.d-flex .btn,
    .card-header .btn {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    /* Stack inline form groups */
    .input-group,
    .form-group {
        flex-wrap: wrap;
    }

    /* Table action buttons — allow wrap */
    .table td:last-child,
    .dataTable-table td:last-child {
        white-space: normal;
    }

    .table td .rounded-circle.btn,
    .dataTable-table td .rounded-circle.btn {
        margin-bottom: 0.25rem;
    }

    /* Notification dropdown */
    .dropdown-menu[style*="min-width"] {
        min-width: min(320px, calc(100vw - 2rem)) !important;
        max-width: calc(100vw - 1.5rem);
    }
}

/* ─── Page subheaders (tabs below title, e.g. Timesheet) ─── */
.card-header.hc-page-subheader {
    display: block !important;
    flex-wrap: unset !important;
    align-items: unset !important;
    padding: 1rem 1.25rem 0.75rem;
}

.card-header.hc-page-subheader > h5,
.card-header.hc-page-subheader > .hc-page-title {
    display: block;
    width: 100%;
    margin-bottom: 0;
}

.hc-page-subheader-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
}

.hc-timesheet-tabs.nav-pills {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    background: #f8f9fa;
    border-radius: 0.5rem;
}

.hc-timesheet-tabs .nav-link {
    border-radius: 0.5rem;
    font-size: 0.875rem;
    white-space: nowrap;
}

/* ─── Training Courses header (title top, controls stacked right) ─── */
.hc-training-header.hc-page-subheader {
    padding-bottom: 0;
}

.hc-training-toolbar {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.hc-training-toolbar-panel {
    width: 100%;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.hc-training-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    width: 100%;
}

.hc-training-row-actions .hc-toolbar-select {
    flex: 1 1 auto;
    min-width: 0;
    height: 40px;
    border-radius: 0.5rem;
    border: 1px solid #d2d6da;
    font-size: 0.875rem;
}

.hc-training-row-actions .btn {
    flex: 0 0 auto;
    height: 40px;
    min-width: 100px;
    white-space: nowrap;
}

.hc-training-row-search {
    justify-content: stretch;
}

.hc-training-row-search .hc-form-search {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.hc-training-row-sort {
    justify-content: flex-end;
}

.hc-training-row-sort .hc-toolbar-label {
    flex: 0 0 auto;
    white-space: nowrap;
}

.hc-training-row-sort .form-select {
    flex: 0 1 200px;
    width: 200px;
    max-width: 100%;
    height: 40px;
    border-radius: 0.5rem;
    border: 1px solid #d2d6da;
    font-size: 0.875rem;
}

.hc-training-header + .hc-datatable-top-compact {
    margin-top: 0.75rem;
}

@media (max-width: 575.98px) {
    .hc-training-toolbar {
        justify-content: stretch;
    }

    .hc-training-toolbar-panel {
        max-width: 100%;
    }

    .hc-training-row-actions {
        flex-wrap: wrap;
    }

    .hc-training-row-actions .btn {
        flex: 1 1 auto;
    }
}

/* ─── Filter pages (Billing Session, Billing History, etc.) ─── */
.card-header.hc-filter-page-header {
    display: block !important;
    flex-wrap: unset !important;
    align-items: unset !important;
    padding: 1rem 1.25rem 0.75rem;
}

.card-header.hc-filter-page-header > h5 {
    display: block;
    width: 100%;
    margin-bottom: 0;
}

.hc-filter-page-toolbar {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    width: 100%;
}

.hc-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0.5rem;
    width: 100%;
}

.hc-filter-field {
    flex: 0 1 auto;
    min-width: 160px;
    max-width: 200px;
}

.hc-filter-field-sm {
    min-width: 140px;
    max-width: 160px;
}

.hc-filter-field-btn {
    min-width: auto;
    max-width: none;
    flex: 0 0 auto;
}

.hc-filter-field label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #67748e;
    margin-bottom: 0.35rem;
    text-transform: capitalize;
}

.hc-filter-field label.invisible {
    visibility: hidden;
    height: 1.1rem;
    margin-bottom: 0.35rem;
}

.hc-filter-field .form-control,
.hc-filter-field select.form-control,
.hc-filter-field .hc-toolbar-select {
    height: 40px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    border-radius: 0.5rem;
    border: 1px solid #d2d6da;
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    background-color: #fff;
}

.hc-filter-field .btn {
    height: 40px;
    white-space: nowrap;
    padding: 0.4rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 600;
}

.hc-filter-page-header .hc-listing-toolbar-search {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.hc-filter-page-header .hc-listing-toolbar-search .dataTable-search {
    max-width: 280px;
    min-width: 200px;
}

@media (max-width: 767.98px) {
    .hc-filter-field,
    .hc-filter-field-sm,
    .hc-filter-field-btn {
        min-width: 100%;
        max-width: 100%;
    }

    .hc-filter-field-btn .d-flex {
        width: 100%;
    }

    .hc-filter-field-btn .btn {
        flex: 1 1 auto;
    }
}

/* ─── Card headers & toolbars (all listing pages) ─── */
.card-header.hc-listing-card-header,
.card-header[class*="d-flex"]:has(.hc-listing-toolbar),
.card-header[class*="d-flex"]:has(.ms-auto) {
    flex-wrap: nowrap;
    gap: 0.75rem;
    align-items: flex-start !important;
    padding: 1rem 1.25rem 0.75rem;
}

.card-header.hc-listing-card-header > h5,
.card-header.hc-listing-card-header > h6,
.card-header[class*="d-flex"] > h5,
.card-header[class*="d-flex"] > h6 {
    flex-shrink: 0;
    margin-bottom: 0;
    padding-top: 0.5rem;
    line-height: 1.2;
}

/* Right-side toolbar: row 1 = filters/buttons, row 2 = search */
.hc-listing-toolbar {
    margin-left: auto !important;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    flex-shrink: 0;
    width: max-content;
    max-width: calc(100% - 8rem);
}

.hc-listing-toolbar-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.hc-listing-toolbar-actions > *,
.hc-listing-toolbar-actions > div {
    flex: 0 0 auto;
}

.hc-listing-toolbar-actions .input-group,
.hc-listing-toolbar-actions .input-group-outline,
.hc-listing-toolbar-actions form {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none;
    margin-bottom: 0 !important;
    margin-right: 0 !important;
}

.hc-listing-toolbar-actions .me-2,
.hc-listing-toolbar-actions .mx-2 {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.hc-listing-toolbar-search {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

/* Toolbar controls — unified sizing */
.hc-listing-toolbar-actions select.form-control,
.hc-listing-toolbar-actions .form-control,
.hc-listing-toolbar-actions .form-select,
.hc-listing-toolbar-actions .hc-toolbar-select {
    height: 40px;
    min-width: 170px;
    max-width: 220px;
    border-radius: 0.5rem;
    border: 1px solid #d2d6da;
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    background-color: #fff;
}

.hc-listing-toolbar-actions .btn {
    height: 40px;
    min-width: 100px;
    padding: 0.4rem 1rem;
    border-radius: 0.5rem;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0 !important;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.hc-listing-toolbar-actions .btn-archive,
.hc-listing-toolbar-actions .btn.btn-archive {
    background-color: #7b809a;
    color: #fff;
    border: none;
}

.hc-listing-toolbar-actions .btn-archive:hover {
    background-color: #6a7389;
    color: #fff;
}

.hc-listing-toolbar-actions .hc-toolbar-label {
    font-size: 0.875rem;
    color: #67748e;
    white-space: nowrap;
}

.hc-per-page-select {
    height: 32px;
    min-width: 60px;
    width: auto;
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    padding: 0.2rem 0.5rem;
}

.hc-datatable-top-compact .text-sm {
    font-size: 0.8125rem;
}

/* Legacy headers before component migration */
.card-header[class*="d-flex"]:not(.hc-listing-card-header) > .ms-auto.d-flex:not(.hc-listing-toolbar),
.card-header[class*="d-flex"]:not(.hc-listing-card-header) > .ms-auto:not(.hc-listing-toolbar) {
    margin-left: auto !important;
    flex-wrap: nowrap !important;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* ─── DataTable search — attractive pill style, second row right ─── */
.dataTable-search,
.hc-form-search {
    position: relative;
}

.hc-listing-toolbar-search .dataTable-search,
.hc-listing-toolbar-search .hc-inline-search,
.hc-listing-toolbar-search .hc-form-search {
    margin: 0 !important;
    width: 100%;
    min-width: 200px;
    max-width: 280px;
}

.hc-listing-toolbar-extra {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    width: 100%;
}

.hc-listing-toolbar-extra .hc-toolbar-select-sm,
.hc-listing-toolbar-extra .form-select {
    height: 40px;
    min-width: 150px;
    max-width: 200px;
    border-radius: 0.5rem;
    border: 1px solid #d2d6da;
    font-size: 0.875rem;
}

.dataTable-search::before,
.hc-form-search::before {
    content: 'search';
    font-family: 'Material Icons Round';
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #8392ab;
    font-size: 1.15rem;
    line-height: 1;
    pointer-events: none;
    z-index: 2;
}

.dataTable-search .dataTable-input,
.hc-form-search .hc-search-input,
.hc-form-search .form-control {
    width: 100%;
    min-width: 180px;
    height: 40px;
    padding: 0.45rem 1rem 0.45rem 2.5rem;
    border: 1px solid #d2d6da;
    border-radius: 50px;
    background-color: #f8fafc;
    font-size: 0.875rem;
    color: #344767;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: border-color var(--hc-transition),
                box-shadow var(--hc-transition),
                background-color var(--hc-transition);
}

.dataTable-search .dataTable-input::placeholder,
.hc-form-search .hc-search-input::placeholder,
.hc-form-search .form-control::placeholder {
    color: #a8b5c7;
}

.dataTable-search .dataTable-input:hover,
.hc-form-search .hc-search-input:hover,
.hc-form-search .form-control:hover {
    border-color: rgba(64, 224, 208, 0.55);
    background-color: #fff;
}

.dataTable-search .dataTable-input:focus,
.hc-form-search .hc-search-input:focus,
.hc-form-search .form-control:focus {
    outline: none;
    border-color: var(--hc-brand-teal);
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(64, 224, 208, 0.18);
}

/* Per-page selector — consistent row below header */
.card .dataTable-top.hc-datatable-top-compact {
    padding: 0 1.25rem 0.65rem !important;
    min-height: 0;
    margin-top: 0;
    display: flex;
    align-items: center;
    clear: both;
}

.card .dataTable-top.hc-datatable-top-compact > div {
    float: none !important;
}

.card .dataTable-top.hc-datatable-top-compact .dataTable-dropdown label,
.card .dataTable-top.hc-datatable-top-compact .dataTable-selector {
    font-size: 0.8125rem;
    color: #67748e;
}

@media (max-width: 991.98px) {
    .card-header.hc-listing-card-header,
    .card-header[class*="d-flex"]:has(.hc-listing-toolbar) {
        flex-wrap: wrap;
    }

    .hc-listing-toolbar {
        max-width: 100%;
    }

    .hc-listing-toolbar-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

@media (max-width: 575.98px) {
    .hc-listing-toolbar {
        width: 100%;
        margin-left: 0 !important;
        align-items: flex-end;
    }

    .hc-listing-toolbar-actions select.form-control,
    .hc-listing-toolbar-actions .form-select {
        min-width: 140px;
        max-width: 100%;
    }

    .hc-listing-toolbar-search .dataTable-search,
    .hc-listing-toolbar-search .hc-form-search {
        min-width: 0;
        max-width: 100%;
    }
}

/* ─── Tables ─── */
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--hc-radius);
}

.table-responsive table,
.dataTable-table {
    min-width: max-content;
}

@media (hover: hover) {
    .table.table-flush tbody tr:hover,
    .dataTable-table tbody tr:hover {
        background-color: rgba(64, 224, 208, 0.06) !important;
        box-shadow: inset 3px 0 0 var(--hc-brand-teal);
    }
}

/* ─── Sidebar nav hover ─── */
.sidenav .navbar-nav > .nav-item > .nav-link:not(.active):hover {
    background: rgba(64, 224, 208, 0.08);
    border-radius: var(--hc-radius);
}

.sidenav .navbar-nav > .nav-item > .nav-link:not(.active):hover .icon {
    background: linear-gradient(135deg, rgba(64, 224, 208, 0.2) 0%, rgba(181, 155, 102, 0.2) 100%) !important;
    box-shadow: var(--hc-shadow-sm);
    transform: scale(1.08);
}

.sidenav .navbar-nav > .nav-item > .nav-link:not(.active):hover .nav-link-text {
    color: var(--hc-text-primary) !important;
    font-weight: 500;
}

.sidenav .collapse .nav-item .nav-link:not(.active):hover {
    background: rgba(64, 224, 208, 0.06);
    border-radius: 0.5rem;
    padding-left: 0.75rem !important;
}

/* ─── Cards hover (dashboard & listing — not nested form sections) ─── */
@media (hover: hover) {
    .container-fluid > .row > [class*="col-"] > .card:not(.no-hover):hover,
    .container-fluid > .row.align-items-stretch > [class*="col-"] > .card:not(.no-hover):hover {
        box-shadow: var(--hc-shadow-md);
        transform: translateY(-2px);
    }

    .card[style*="cursor: pointer"]:hover,
    .card.cursor-pointer:hover {
        box-shadow: var(--hc-shadow-hover);
        transform: translateY(-3px);
    }
}

/* ─── Buttons ─── */
@media (hover: hover) {
    .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(52, 71, 103, 0.15);
    }

    .btn:active {
        transform: translateY(0);
        box-shadow: var(--hc-shadow-sm);
    }

    .btn-primary:hover,
    .bg-gradient-primary:hover {
        box-shadow: 0 8px 20px rgba(64, 224, 208, 0.35);
    }

    .btn-outline-primary:hover {
        background-color: rgba(64, 224, 208, 0.1);
        border-color: var(--hc-brand-teal);
        color: var(--hc-text-primary);
    }

    .btn-outline-secondary:hover {
        background-color: rgba(103, 116, 142, 0.08);
    }
}

/* Table action circle buttons */
@media (hover: hover) {
    .rounded-circle.btn:hover {
        transform: scale(1.12) translateY(-2px);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);
        filter: brightness(1.08);
        z-index: 1;
    }

    .rounded-circle.btn.bg-danger:hover {
        box-shadow: 0 6px 14px rgba(234, 6, 6, 0.35);
    }

    .rounded-circle.btn.bg-success:hover {
        box-shadow: 0 6px 14px rgba(130, 214, 22, 0.35);
    }

    .rounded-circle.btn.bg-warning:hover {
        box-shadow: 0 6px 14px rgba(251, 140, 0, 0.35);
    }

    .rounded-circle.btn.bg-primary:hover,
    .rounded-circle.btn.bg-info:hover {
        box-shadow: 0 6px 14px rgba(23, 193, 232, 0.35);
    }
}

/* ─── Links ─── */
@media (hover: hover) {
    a.text-info:hover {
        color: #2cb8a8 !important;
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    .breadcrumb-item a:hover {
        color: var(--hc-brand-teal) !important;
        opacity: 1 !important;
    }

    .text-primary.cursor-pointer:hover,
    a.text-primary:hover {
        color: #2cb8a8 !important;
    }
}

/* ─── Top navbar icons & dropdowns ─── */
@media (hover: hover) {
    .navbar-main .nav-link:hover {
        color: var(--hc-brand-teal) !important;
    }

    .navbar-main .nav-link:hover .material-icons {
        transform: scale(1.1);
    }

    .dropdown-item:hover,
    .dropdown-menu .btn-link:hover {
        background: linear-gradient(90deg, rgba(64, 224, 208, 0.12) 0%, rgba(181, 155, 102, 0.08) 100%);
        color: var(--hc-text-primary);
        padding-left: 1.25rem;
    }

    .navbar-main img.rounded-circle:hover {
        box-shadow: 0 0 0 3px rgba(64, 224, 208, 0.4);
        transform: scale(1.05);
    }
}

/* ─── Form controls focus & hover ─── */
@media (hover: hover) {
    .form-control:hover:not(:focus):not(:disabled),
    .form-select:hover:not(:focus):not(:disabled) {
        border-color: rgba(64, 224, 208, 0.5);
    }
}

.form-control:focus,
.form-select:focus {
    border-color: var(--hc-brand-teal);
    box-shadow: 0 0 0 0.2rem rgba(64, 224, 208, 0.2);
}

/* Select2 hover */
@media (hover: hover) {
    .select2-container--default .select2-selection--single:hover {
        border-color: rgba(64, 224, 208, 0.6);
        box-shadow: var(--hc-shadow-sm);
    }
}

/* ─── List groups & notifications ─── */
@media (hover: hover) {
    .list-group-item:hover,
    .notification-item:hover {
        background-color: rgba(64, 224, 208, 0.06);
        border-left: 3px solid var(--hc-brand-teal);
        padding-left: calc(1rem - 3px);
    }
}

/* ─── Pagination ─── */
@media (hover: hover) {
    .dataTable-pagination a:hover,
    .page-link:hover {
        background: var(--hc-brand-gradient);
        color: #fff !important;
        border-color: transparent;
        transform: translateY(-1px);
    }
}

/* ─── Modals ─── */
.modal-content {
    border: none;
    box-shadow: var(--hc-shadow-md);
}

@media (hover: hover) {
    .modal-footer .btn:hover {
        transform: translateY(-1px);
    }
}

/* ─── Badges & status selects ─── */
@media (hover: hover) {
    .badge:hover {
        filter: brightness(1.05);
        transform: scale(1.03);
    }
}

/* ─── Auth pages ─── */
.page-header .card-body .btn.bg-gradient-primary:hover {
    background-image: var(--hc-brand-gradient) !important;
}

@media (hover: hover) {
    .password-with-toggle .password-toggle-btn:hover {
        color: var(--hc-brand-gold);
        transform: translateY(-50%) scale(1.1);
    }
}

/* ─── Leaderboard / dashboard chart containers ─── */
.chart-canvas,
canvas {
    max-width: 100%;
    height: auto !important;
}

/* ─── Print: disable hover transforms ─── */
@media print {
    * {
        transform: none !important;
        box-shadow: none !important;
        transition: none !important;
    }
}

/* ─── Standalone public pages (thank you, review, dispatch) ─── */
.thankyou-card,
.review-card,
.dispatch-card {
    transition: box-shadow var(--hc-transition), transform var(--hc-transition);
}

@media (hover: hover) {
    .thankyou-card:hover,
    .review-card:hover,
    .dispatch-card:hover {
        box-shadow: 0 16px 40px rgba(52, 71, 103, 0.14);
        transform: translateY(-4px);
    }
}

@media (max-width: 575.98px) {
    .thankyou-card,
    .review-card {
        margin: 1rem;
        padding: 1.5rem 1.25rem !important;
        border-radius: 1rem;
    }

    .review-card {
        margin-top: 1.5rem !important;
    }

    .thankyou-heading {
        font-size: 1.5rem !important;
    }
}

/* Standalone dispatch response */
body.dispatch-response-page .card {
    transition: box-shadow var(--hc-transition), transform var(--hc-transition);
}

@media (hover: hover) {
    body.dispatch-response-page .card:hover {
        box-shadow: 0 16px 40px rgba(64, 224, 208, 0.15);
        transform: translateY(-3px);
    }
}

@media (max-width: 575.98px) {
    body.dispatch-response-page .card {
        padding: 2rem 1.25rem !important;
    }
}