.calendar-container{background:#fff;border-radius:12px;padding:20px;border:1px solid #e2e8f0;box-shadow:0 1px 3px rgba(0,0,0,.1)}.calendar-container--compact{padding:10px 12px;border-radius:10px;box-shadow:0 1px 2px rgba(0,0,0,.06);width:100%;max-width:100%;min-width:0;box-sizing:border-box;touch-action:pan-y pinch-zoom}.calendar-compact-date-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.calendar-compact-date-field{display:flex;flex-direction:column;gap:4px;min-width:0}.calendar-compact-date-label{font-size:11px;font-weight:600;color:#64748b}.calendar-compact-date-input-row{display:flex;align-items:stretch;gap:6px;min-width:0}.calendar-compact-date-input{flex:1;min-width:0;padding:8px 10px;font-size:14px;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc;color:#1e293b;box-sizing:border-box}.calendar-compact-date-input:focus{outline:none;border-color:#3b82f6;background:#fff}.calendar-date-icon-btn{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;min-height:40px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#64748b;cursor:pointer}.calendar-date-icon-btn:hover{background:#f1f5f9;color:#3b82f6}@media (max-width:480px){.calendar-compact-date-inputs{grid-template-columns:1fr}}.calendar-container--compact .calendar-header{margin-bottom:10px;gap:6px;flex-wrap:nowrap}.calendar-container--compact .month-year{font-size:clamp(13px,3.5vw,15px);font-weight:700;flex:1;min-width:0;text-align:center;line-height:1.35;white-space:normal;word-break:break-word;hyphens:auto}.calendar-container--compact .month-year__month,.calendar-container--compact .month-year__year{white-space:nowrap}.calendar-container--compact .nav-button{padding:8px;flex-shrink:0;min-width:40px;min-height:40px}.calendar-container--compact .calendar-grid{gap:2px;margin-bottom:0;width:100%;max-width:100%;min-width:0;grid-template-columns:repeat(7,minmax(0,1fr));touch-action:pan-y pinch-zoom}.calendar-container--compact .calendar-date-icon-btn,.calendar-container--compact .calendar-grid button.calendar-day,.calendar-container--compact .calendar-grid button.calendar-day.empty,.calendar-container--compact .calendar-header .nav-button,.calendar-container--compact input.calendar-compact-date-input{touch-action:pan-y pinch-zoom}.calendar-container--compact .day-name{min-width:0;max-width:100%;padding:5px 1px;font-size:clamp(8px,2.4vw,10px);font-weight:700;line-height:1.15;overflow-wrap:anywhere;word-break:break-word;hyphens:auto}.calendar-container--compact .calendar-day{min-width:0;max-width:100%;font-size:12px;border-radius:4px;min-height:36px;aspect-ratio:1;box-sizing:border-box}@media (max-width:380px){.calendar-container--compact .calendar-day{font-size:11px;min-height:32px}.calendar-container--compact .day-name{font-size:9px;padding:5px 1px}}.calendar-header{justify-content:space-between;margin-bottom:20px}.calendar-header,.nav-button{display:flex;align-items:center}.nav-button{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:8px;cursor:pointer;transition:all .2s ease;justify-content:center}.nav-button:hover{background:#e2e8f0;border-color:#cbd5e1}.month-year{font-size:18px;font-weight:600;color:#1e293b;margin:0;flex:1;min-width:0;text-align:center}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;margin-bottom:20px;width:100%;box-sizing:border-box}.calendar-grid,.day-name{max-width:100%;min-width:0}.day-name{text-align:center;padding:12px 4px;font-weight:600;color:#64748b;background:#f8fafc;overflow-wrap:anywhere;word-break:break-word;hyphens:auto;line-height:1.2}.calendar-day,.day-name{font-size:14px;border-radius:6px}.calendar-day{min-width:0;max-width:100%;aspect-ratio:1;background:#fff;cursor:pointer;font-weight:500;color:#1e293b;transition:all .2s ease;display:flex;align-items:center;justify-content:center;position:relative;border:1px solid transparent;box-sizing:border-box}.calendar-day:hover:not(.disabled):not(.booked):not(.empty){background:#e0f2fe;border-color:#0ea5e9;color:#0c4a6e}.calendar-day.empty{cursor:default;background:transparent}.calendar-day.disabled{color:#cbd5e1;cursor:not-allowed;background:#f8fafc}.calendar-day.booked{background:#fee2e2;color:#991b1b;cursor:not-allowed;position:relative}.calendar-day.booked:after{content:"";position:absolute;top:50%;left:10%;right:10%;height:1px;background:#dc2626;transform:translateY(-50%)}.calendar-day.selected{background:#3b82f6;color:#fff;font-weight:600;border-color:#2563eb}.calendar-day.in-range{background:#dbeafe;color:#1e40af;border-color:#93c5fd}.calendar-legend{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:20px;padding-top:16px;border-top:1px solid #e2e8f0}.legend-item{display:flex;align-items:center;gap:8px;font-size:12px;color:#64748b}.legend-color{width:16px;height:16px;border-radius:4px;border:1px solid #e2e8f0}.legend-color.selected{background:#3b82f6}.legend-color.in-range{background:#dbeafe}.legend-color.booked{background:#fee2e2;position:relative}.legend-color.booked:after{content:"";position:absolute;top:50%;left:2px;right:2px;height:1px;background:#dc2626;transform:translateY(-50%)}.legend-color.disabled{background:#f8fafc}.selected-dates-summary{background:#f0f9ff;border:1px solid #0ea5e9;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:8px}.date-summary,.nights-count{display:flex;justify-content:space-between;align-items:center}.date-summary .label,.nights-count .label{font-size:14px;color:#0c4a6e;font-weight:500}.date-summary .date,.nights-count .count{font-size:14px;color:#0c4a6e;font-weight:600}.nights-count{padding-top:8px;border-top:1px solid #7dd3fc;margin-top:4px}@media (max-width:768px){.calendar-container{padding:16px}.calendar-header{margin-bottom:16px}.month-year{font-size:16px}.nav-button{padding:6px}.day-name{padding:8px 2px}.calendar-day,.day-name{font-size:12px}.calendar-legend{gap:12px}.legend-item{font-size:11px}.selected-dates-summary{padding:12px}.date-summary .date,.date-summary .label,.nights-count .count,.nights-count .label{font-size:13px}}@media (max-width:480px){.calendar-container{padding:12px}.calendar-grid{gap:1px}.day-name{padding:6px 1px}.calendar-day,.day-name{font-size:11px}.calendar-legend{flex-direction:column;gap:8px}.legend-color{width:14px;height:14px}}