/* ===== DESIGN INSPIRED (escopo: calendário do imóvel) ===== */

                        #interactive-calendar-container,
                        #interactive-calendar-container * {
                            box-sizing: border-box;
                        }

                        #interactive-calendar-container {
                            font-family: system-ui, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
                        }

                        /* Filtros com Design Clean */
                        .calendar-filters {
                            background: #FFFFFF;
                            padding: 24px;
                            border-radius: 12px;
                            margin-bottom: 24px;
                            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
                            border: 1px solid #E2E8F0;
                        }

                        .calendar-filters label {
                            color: #2D3748;
                            font-weight: 500;
                            margin-bottom: 8px;
                            display: block;
                            font-size: 14px;
                        }

                        .calendar-filters .form-control {
                            border: 1px solid #E2E8F0;
                            border-radius: 8px;
                            padding: 12px 16px;
                            background: #FFFFFF;
                            transition: all 0.2s ease;
                            font-size: 16px;
                        }

                        .calendar-filters .form-control:focus {
                            border-color: #667EEA;
                            font-weight: 600;
                            box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
                            outline: none;
                        }

                        .calendar-filters .btn-primary {
                            background: #667EEA;
                            color: #FFFFFF;
                            border: none;
                            border-radius: 8px;
                            padding: 12px 24px;
                            font-weight: 500;
                            transition: all 0.2s ease;
                            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
                        }

                        .calendar-filters .btn-primary:hover {
                            background: #5A67D8;
                            font-weight: 600;
                            transform: translateY(-1px);
                            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
                        }

                        /* Wrapper do Calend�rio */
                        .calendar-wrapper {
                            position: relative;
                            overflow: hidden;
                            margin-bottom: 24px;
                        }

                        /* Dica de Scroll */
                        .scroll-hint {
                            text-align: center;
                            font-size: 14px;
                            color: #555;
                            margin-bottom: 6px;
                            animation: pulse 2s infinite;
                            user-select: none;
                        }

                        @keyframes pulse {

                            0%,
                            100% {
                                opacity: 0.5;
                                transform: translateY(0);
                            }

                            50% {
                                opacity: 1;
                                transform: translateY(-2px);
                            }
                        }

                        /* Container do Calend�rio */
                        .calendar-container {
                            background: #FFFFFF;
                            border-radius: 12px;
                            padding: 0;
                            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
                            position: relative;
                            overflow-x: auto;
                            white-space: nowrap;
                            scroll-behavior: smooth;
                            padding-bottom: 10px;
                        }

                        /* Cabe�alho do Calend�rio */
                        .calendar-header {
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            flex-direction: column;

                            padding: 16px 24px;
                            background: linear-gradient(135deg, #7F9CF5 0%, #5A67D8 100%);
                            border-radius: 12px 12px 0 0;
                            position: relative;
                            z-index: 1000;
                            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
                            backdrop-filter: blur(10px);
                            -webkit-backdrop-filter: blur(10px);
                            width: 100%;
                            box-sizing: border-box;
                        }

                        /* Bot�es de Navega��o */
                        .nav-buttons {
                            display: flex;
                            width: 100%;
                            justify-content: space-between;
                            margin-bottom: 10px;
                        }

                        .calendar-nav {
                            background: rgba(255, 255, 255, 0.2);
                            color: white;
                            border: none;
                            border-radius: 8px;
                            padding: 8px 12px;
                            cursor: pointer;
                            font-size: 14px;
                            font-weight: 500;
                            width: 100px;
                            height: 40px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            transition: all 0.2s ease;
                        }

                        .calendar-nav:hover {
                            background: rgba(255, 255, 255, 0.3);
                        }

                        .calendar-nav:active {
                            transform: scale(0.95);
                        }

                        .calendar-title {
                            font-size: 18px;
                            font-weight: 600;
                            color: white;
                            text-align: center;
                            flex: 1;
                        }

                        /* Grid do Calend�rio */
                        .calendar-grid {
                            display: grid;
                            grid-template-columns: repeat(7, 1fr);
                            gap: 0;
                            background: #F7FAFC;
                            min-width: 100%;
                            overflow-x: auto;
                            scroll-snap-type: x mandatory;
                            -webkit-overflow-scrolling: touch;
                        }

                        /* Cabe�alho dos Dias */
                        .calendar-day-header {
                            background: #EDF2F7;
                            padding: 12px 8px;
                            text-align: center;
                            font-weight: 600;
                            color: #4A5568;
                            font-size: 12px;
                            text-transform: uppercase;
                            letter-spacing: 0.5px;
                        }

                        /* Dias do Calend�rio */
                        .calendar-day {
                            background: #FFFFFF;
                            padding: 12px 8px;
                            min-height: 80px;
                            border: none;
                            position: relative;
                            cursor: pointer;
                            transition: all 0.2s ease;
                            display: flex;
                            flex-direction: column;
                            justify-content: flex-start;
                            align-items: center;
                            scroll-snap-align: start;
                            border-radius: 8px;
                            margin: 2px;
                        }

                        .calendar-day:hover {
                            background: #F7FAFC;
                            transform: translateY(-1px);
                            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
                        }

                        /* Status dos Dias  */
                        .calendar-day.available {
                            background: #C6F6D5;
                        }

                        .calendar-day.available:hover {
                            background: #9AE6B4;
                            transform: translateY(-2px);
                            box-shadow: 0 4px 12px rgba(56, 178, 172, 0.2);
                        }

                        .calendar-day.booked {
                            background: #FED7D7;
                            cursor: not-allowed;
                            opacity: 0.8;
                        }

                        .calendar-day.check-in-out {
                            background: linear-gradient(135deg, #FEEBC8 0%, #C6F6D5 100%);
                        }

                        .calendar-day.other-month {
                            background: #EDF2F7;
                            color: #A0AEC0;
                            opacity: 0.6;
                        }

                        /* Elementos dos Dias */
                        .day-number {
                            font-weight: 700;
                            font-size: 16px;
                            line-height: 1;
                            color: #2D3748;
                            margin-bottom: 4px;
                        }

                        .day-price {
                            font-size: 12px;
                            color: #4A5568;
                            font-weight: 400;
                            line-height: 1;
                        }

                        .day-status {
                            font-size: 10px;
                            color: #718096;
                            margin-top: 4px;
                            line-height: 1;
                            text-align: center;
                            text-transform: uppercase;
                            letter-spacing: 0.3px;
                        }

                        /* Total Estimado */
                        .total-estimate {
                            background: #F7FAFC;
                            padding: 20px;
                            border-radius: 12px;
                            text-align: center;
                            margin-top: 24px;
                            border: 1px solid #E2E8F0;
                        }

                        .total-estimate h4 {
                            margin: 0;
                            color: #2D3748;
                            font-size: 16px;
                            font-weight: 600;
                        }

                        #total-value {
                            color: #38A169;
                            font-size: 20px;
                            font-weight: 700;
                        }

                        .loading {
                            text-align: center;
                            padding: 40px;
                            color: #718096;
                            font-size: 14px;
                        }

                        /* Legenda de Cores */
                        .calendar-legend {
                            display: flex;
                            justify-content: center;
                            gap: 20px;
                            margin-top: 16px;
                            padding: 16px;
                            background: #F7FAFC;
                            border-radius: 8px;
                            flex-wrap: wrap;
                        }

                        .legend-item {
                            display: flex;
                            align-items: center;
                            gap: 8px;
                            font-size: 12px;
                            color: #4A5568;
                        }

                        .legend-color {
                            width: 12px;
                            height: 12px;
                            border-radius: 50%;
                        }

                        .legend-color.available {
                            background: #C6F6D5;
                        }

                        .legend-color.booked {
                            background: #FED7D7;
                        }

                        .legend-color.check-in-out {
                            background: linear-gradient(135deg, #FEEBC8 0%, #C6F6D5 100%);
                        }

                        .legend-color.no-rate {
                            background: #EDF2F7;
                        }

                        /* Alertas de Sucesso e Info */
                        .calendar-alert.success {
                            background-color: #D1FAE5;
                            border: 1px solid #10B981;
                            color: #065F46;
                        }

                        .calendar-alert.info {
                            background-color: #DBEAFE;
                            border: 1px solid #3B82F6;
                            color: #1E40AF;
                        }

                        .calendar-alert a {
                            color: inherit;
                            text-decoration: underline;
                            font-weight: 600;
                        }

                        /* ===== RESPONSIVIDADE ===== */

                        /* Tablet (? 768px) */
                        @media (max-width: 768px) {
                            .calendar-filters {
                                padding: 20px;
                                margin-bottom: 20px;
                            }

                            .calendar-wrapper {
                                margin-bottom: 20px;
                            }

                            .calendar-container {
                                border-radius: 8px;
                            }

                            .scroll-hint {
                                font-size: 12px;
                            }

                            .calendar-alert {
                                max-width: 100% !important;
                                font-size: 13px;
                                padding: 11px 14px;
                                word-break: break-word !important;
                                word-wrap: break-word !important;
                                overflow-wrap: break-word !important;
                                white-space: normal !important;
                            }

                            .calendar-header {
                                padding: 12px 20px;
                                margin-bottom: 30px;
                                border-radius: 8px 8px 0 0;
                                position: relative;
                                z-index: 1000;
                                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
                                width: 100%;
                                box-sizing: border-box;
                            }

                            .calendar-nav {
                                width: 36px;
                                height: 36px;
                                font-size: 12px;
                            }

                            .calendar-title {
                                font-size: 16px;
                            }


                            .calendar-day {
                                min-height: 70px;
                                padding: 10px 6px;
                            }

                            .day-number {
                                font-size: 15px;
                            }

                            .day-price {
                                font-size: 11px;
                            }

                            .day-status {
                                font-size: 9px;
                            }

                            .total-estimate {
                                padding: 16px;
                            }

                            .total-estimate h4 {
                                font-size: 14px;
                            }

                            #total-value {
                                font-size: 18px;
                            }

                            .calendar-legend {
                                gap: 16px;
                                padding: 12px;
                            }
                        }

                        /* Mobile (? 480px) */
                        @media (max-width: 480px) {
                            .calendar-filters {
                                padding: 16px;
                                margin-bottom: 16px;
                            }

                            .calendar-wrapper {
                                margin-bottom: 16px;
                            }

                            .calendar-container {
                                border-radius: 8px;
                            }

                            .scroll-hint {
                                font-size: 11px;
                            }

                            .calendar-alert {
                                max-width: 100% !important;
                                font-size: 13px;
                                padding: 10px 12px;
                                word-break: break-word !important;
                                word-wrap: break-word !important;
                                overflow-wrap: break-word !important;
                                white-space: normal !important;
                            }

                            .calendar-header {
                                padding: 10px 16px;
                                border-radius: 8px 8px 0 0;
                                position: relative;
                                z-index: 1000;
                                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
                                width: 100%;
                                box-sizing: border-box;
                            }

                            .calendar-nav {
                                width: 88px;
                                height: 32px;
                                font-size: 11px;
                                padding: 6px 8px;
                            }

                            .calendar-title {
                                font-size: 14px;
                            }


                            .calendar-day {
                                min-height: 60px;
                                padding: 8px 4px;
                                min-width: 90px;
                            }

                            .calendar-day-header {
                                padding: 8px 4px;
                                font-size: 10px;
                            }

                            .day-number {
                                font-size: 14px;
                            }

                            .day-price {
                                font-size: 10px;
                            }

                            .day-status {
                                font-size: 8px;
                            }

                            .total-estimate {
                                padding: 12px;
                            }

                            .total-estimate h4 {
                                font-size: 13px;
                            }

                            #total-value {
                                font-size: 16px;
                            }

                            .calendar-legend {
                                gap: 12px;
                                padding: 10px;
                                font-size: 11px;
                            }
                        }

                        /* ===== CONTAINER SEM SCROLL VERTICAL ===== */
                        .calendar-container {
                            overflow-x: auto;
                            overflow-y: visible;
                        }

                        /* ===== SCROLL ISOLADO DO GRID ===== */
                        .calendar-grid {
                            scrollbar-width: thin;
                            scrollbar-color: #CBD5E0 #F7FAFC;
                        }

                        .calendar-grid::-webkit-scrollbar {
                            height: 6px;
                        }

                        .calendar-grid::-webkit-scrollbar-track {
                            background: #F7FAFC;
                            border-radius: 3px;
                        }

                        .calendar-grid::-webkit-scrollbar-thumb {
                            background: #CBD5E0;
                            border-radius: 3px;
                        }

                        .calendar-grid::-webkit-scrollbar-thumb:hover {
                            background: #A0AEC0;
                        }

                        /* ===== ANIMA��ES TOUCH ===== */
                        @media (hover: none) and (pointer: coarse) {
                            .calendar-day:hover {
                                transform: none;
                            }

                            .calendar-day:active {
                                transform: scale(0.98);
                                background: #E2E8F0;
                            }

                            .calendar-nav:hover {
                                transform: none;
                            }

                            .calendar-nav:active {
                                transform: scale(0.9);
                            }
                        }

                        /* ===== ACESSIBILIDADE ===== */
                        .calendar-day:focus {
                            outline: 2px solid #667EEA;
                            outline-offset: 2px;
                        }

                        .calendar-nav:focus {
                            outline: 2px solid rgba(255, 255, 255, 0.5);
                            outline-offset: 2px;
                        }

                        /* ===== BOT�ES FLUTUANTES MOBILE ===== */
                        @media (max-width: 768px) {
                            .calendar-nav {
                                position: fixed;
                                width: 88px;
                                z-index: 1000;
                                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
                                background: #667EEA;
                            }

                            .calendar-nav[data-direction="prev"] {
                                left: 20px;
                            }

                            .calendar-nav[data-direction="next"] {
                                right: 20px;
                            }
                        }

                        /* ===== ANIMA��O FADE-IN ===== */
                        .calendar-container.fade-in {
                            animation: fadeIn 0.3s ease-in-out;
                        }

                        @keyframes fadeIn {
                            from {
                                opacity: 0;
                                transform: translateY(10px);
                            }

                            to {
                                opacity: 1;
                                transform: translateY(0);
                            }
                        }

                        /* ===== DESTAQUE DO INTERVALO SELECIONADO ===== */
                        .calendar-day.selected {
                            background: #E6FFFA;
                            border: 2px solid #38B2AC;
                        }

                        .calendar-day.selected:hover {
                            background: #B2F5EA;
                        }

                        /* ===== ALERTAS DO CALEND�RIO ===== */
                        .calendar-alert {
                            padding: 12px 16px;
                            border-radius: 8px;
                            margin-bottom: 16px;
                            margin-top: 16px;
                            width: 100% !important;
                            max-width: 400px !important;
                            font-size: 14px;
                            font-weight: 500;
                            display: block;
                            animation: fadeInAlert 0.3s ease-in-out;
                            word-wrap: break-word !important;
                            word-break: break-word !important;
                            overflow-wrap: break-word !important;
                            hyphens: auto;
                            line-height: 1.4;
                            white-space: normal !important;
                            overflow: hidden;
                        }

                        .calendar-alert.info {
                            background: #E6F3FF;
                            color: #1E40AF;
                            border: 1px solid #93C5FD;
                        }

                        .calendar-alert.warning {
                            background: #FEE2E2;
                            color: #7F1D1D;
                            border: 1px solid #FCA5A5;
                            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
                        }

                        .calendar-alert.success {
                            background: #D1FAE5;
                            color: #065F46;
                            border: 1px solid #6EE7B7;
                        }

                        /* For�a quebra de texto em todos os elementos */
                        .calendar-alert * {
                            word-wrap: break-word !important;
                            word-break: break-word !important;
                            overflow-wrap: break-word !important;
                            white-space: normal !important;
                            max-width: 100% !important;
                        }

                        /* Texto dentro dos alerts */
                        .calendar-alert span {
                            word-wrap: break-word !important;
                            word-break: break-word !important;
                            overflow-wrap: break-word !important;
                            hyphens: auto;
                            line-height: 1.4;
                            white-space: normal !important;
                            display: inline;
                        }

                        /* �cone dos alerts */
                        .calendar-alert span:first-child {
                            font-size: 16px;
                            line-height: 1;
                            margin-right: 8px;
                            display: inline-block;
                        }

                        @keyframes fadeInAlert {
                            from {
                                opacity: 0;
                                transform: translateY(-10px);
                            }

                            to {
                                opacity: 1;
                                transform: translateY(0);
                            }
                        }

                        .calendar-alert.fade-out {
                            animation: fadeOutAlert 0.3s ease-in-out forwards;
                        }

                        @keyframes fadeOutAlert {
                            from {
                                opacity: 1;
                                transform: translateY(0);
                            }

                            to {
                                opacity: 0;
                                transform: translateY(-10px);
                            }
                        }

                        /* Toast mobile — fora do calendário, acima da barra de reserva */
                        .calendar-alert.calendar-alert--toast {
                            position: fixed;
                            left: 12px;
                            right: 12px;
                            bottom: calc(148px + env(safe-area-inset-bottom, 0px));
                            z-index: 11050;
                            width: auto !important;
                            max-width: none !important;
                            margin: 0 !important;
                            display: flex;
                            align-items: flex-start;
                            gap: 10px;
                            padding: 14px 16px;
                            border-radius: 12px;
                            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
                            animation: toastInAlert 0.28s ease-out;
                        }

                        .calendar-alert.calendar-alert--toast .calendar-alert__text {
                            flex: 1;
                            min-width: 0;
                        }

                        .calendar-alert.calendar-alert--toast a {
                            word-break: break-all;
                        }

                        .calendar-alert.calendar-alert--toast .calendar-alert__close {
                            flex: 0 0 auto;
                            display: inline-flex;
                            align-items: center;
                            justify-content: center;
                            width: 32px;
                            height: 32px;
                            margin: -4px -6px -4px 0;
                            padding: 0;
                            border: none;
                            border-radius: 8px;
                            background: transparent;
                            color: inherit;
                            font-size: 22px;
                            font-weight: 600;
                            line-height: 1;
                            cursor: pointer;
                            opacity: 0.65;
                            -webkit-appearance: none;
                            appearance: none;
                        }

                        .calendar-alert.calendar-alert--toast .calendar-alert__close:hover,
                        .calendar-alert.calendar-alert--toast .calendar-alert__close:focus {
                            opacity: 1;
                            background: rgba(0, 0, 0, 0.06);
                            outline: none;
                        }

                        .calendar-alert.calendar-alert--toast .calendar-alert__close:active {
                            background: rgba(0, 0, 0, 0.1);
                        }

                        @keyframes toastInAlert {
                            from {
                                opacity: 0;
                                transform: translateY(12px);
                            }
                            to {
                                opacity: 1;
                                transform: translateY(0);
                            }
                        }

                        @keyframes toastOutAlert {
                            from {
                                opacity: 1;
                                transform: translateY(0);
                            }
                            to {
                                opacity: 0;
                                transform: translateY(12px);
                            }
                        }

                        .calendar-alert.calendar-alert--toast.fade-out {
                            animation: toastOutAlert 0.3s ease-in-out forwards;
                        }

/* SPEC-001 Fase 4 - collapse mobile do calendario mensal */
.room-calendar-collapse-toggle {
    display: none;
}

@media (max-width: 991px) {
    .room-calendar-collapse-toggle {
        display: block;
        width: 100%;
        margin: 0 0 12px;
        padding: 12px 16px;
        border: 1px solid #E2E8F0;
        border-radius: 8px;
        background: #fff;
        color: #2D3748;
        font-size: 14px;
        font-weight: 600;
        text-align: left;
    }

    .room-calendar-collapse-toggle:after {
        content: " +";
        float: right;
        font-weight: 400;
        color: #718096;
    }

    .room-calendar-collapse-toggle[aria-expanded="true"]:after {
        content: " -";
        float: right;
        font-weight: 400;
        color: #718096;
    }

    .room-calendar-collapse:not(.is-open) {
        display: none;
    }
}