/* ============================================================
   КАЛЕНДАРЬ - ПОЛНЫЙ ФАЙЛ СТИЛЕЙ
   ============================================================ */
/* ===== БАННЕР ===== */
.calendar-banner {text-align:center;margin:0 auto;max-width: 445px;font:400 16px/24px 'Circe';color: #FFFFFF}
.banner-phone {font-weight: 700; color: #FFFFFF; white-space:nowrap}
.banner-phone:hover {color:#A38C5D}
/* ===== ОБЩИЕ СТИЛИ ===== */
.calendar-wrapper {max-width: 940px;margin: 0 auto;padding: 50px 0 0}
/* ===== ВЕРХНЯЯ ПАНЕЛЬ ===== */
.calendar-topbar{display: flex;justify-content: space-between;align-items: center;padding: 0 0 20px 0;flex-wrap: wrap;gap: 15px;font: 400 16px/1 'Circe';color: #FFFFFF}
.calendar-topbar-right {display: flex;align-items: center;gap: 12px}
.calendar-nav-buttons {display: flex;gap: 12px}
.calendar-nav-btn {display: flex;align-items: center;justify-content: center;color: #fff;transition: all 0.3s;cursor: pointer}
.calendar-nav-btn:hover{color: #A38C5D}
/* ===== СЕТКА КАЛЕНДАРЯ ===== */
.calendar-grid {border-radius: 12px;overflow: hidden}
.calendar-weekdays {display: grid;grid-template-columns: repeat(7, 1fr);padding: 16px 0;font: 700 16px/1 'Circe', sans-serif;text-align: center;color: #FFFFFF}
.calendar-weekdays .weekends{color:#A38C5D}
.calendar-days {display: grid;grid-template-columns: repeat(7, 1fr);gap: clamp(10px, 1.3vw, 15px)}
/* ===== ЯЧЕЙКИ ДНЕЙ ===== */
.day-cell {min-height: 85px;padding: clamp(10px, 1.3vw, 15px);display: flex;flex-direction: column;align-items: center;justify-content: space-between;cursor: default;transition: all 0.2s;background: #1A1A1A;position: relative;border-radius: 15px;min-width: 0;width: 100%;}
.day-cell.empty {background: #fafbfc;min-height: 85px}
.day-cell.other-month, .day-cell.end-day{opacity: 0.2}
.day-cell.current-month {background: #1A1A1A;border: 1px solid #1A1A1A}
.day-cell.today{border-color: #A38C5D !important}
.day-cell.today::after {content: "сегодня";position: absolute;padding: 1px 5px 3px;background: #FF6600;border-radius: 9000px;font: 400 11px/1 'Circe';color: #FFFFFF;top: -2px;right: -2px;animation: todayBadge 2s ease-in-out infinite;}
@keyframes todayBadge {
  0% {transform: rotate(-4.02deg) scale(1);}
  50% {transform: rotate(4.02deg) scale(1.05);}
  100% {transform: rotate(-4.02deg) scale(1);}
}
.day-cell.today .day-number{color: #FFFFFF;}
.day-cell.today .day-month {color: rgba(255,255,255,0.8);}
.day-cell.today .day-events-count {color: #FFFFFF}
.day-cell.has-events{cursor: pointer}
.day-cell.current-month.has-events:hover{background: #282828;border-color: #373737}
.day-cell.current-month.has-events:hover .day-events-count i{opacity:1}
/* ===== ВНУТРИ ЯЧЕЙКИ ===== */
.day-wrap{display: flex;width: 100%;gap: 5px;font: 700 16px/1 'Circe', sans-serif;text-overflow: ellipsis}
.day-month{overflow: hidden;text-overflow: ellipsis}
.day-events-count{font: 500 10px/15px 'Circe';color: #fff;white-space: nowrap;width: 100%;display:flex; gap:5px; align-items:center}
.day-events-count span.events-count__text{overflow: hidden;text-overflow: ellipsis; }
.day-events-count span.events-count__count{display: flex;justify-content: center;align-items: center;width: 15px;min-width: 15px;height: 15px;background: #01E311;border-radius: 100%}
.day-events-count i{transition: all 0.2s; font-style:normal; opacity:0}
/* ===== ВЫХОДНЫЕ ДНИ ===== */
.day-cell.weekend{background: #2E2A20;border-color: #2E2A20}
.day-cell.other-month.weekend {opacity: 0.2;pointer-events: none}
.day-cell.other-month.weekend .day-number{color: #adb5bd}
.day-cell.other-month.weekend .day-month{color: #adb5bd}
/* ===== ЯЧЕЙКА СО ССЫЛКОЙ НА СЛЕДУЮЩИЙ МЕСЯЦ ===== */
.day-cell.next-month-link-cell {background: transparent;min-height: 85px;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: all 0.3s;border-radius: 0;width: 100%;padding: 0}
.next-month-link {font: 400 16px/1 'Circe', sans-serif;color: #fff; text-decoration: none; padding: 0; transition: all 0.3s;white-space: nowrap}
.next-month-link:hover{color: #01E311}
/* ============================================================
   МОДАЛКА
   ============================================================ */
.modal-overlay {display: none;position: fixed;z-index: 99999;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.6);backdrop-filter: blur(6px);align-items: center;justify-content: center; padding:4px}
.modal-overlay.active{display: flex}
.modal-box{max-width: 435px; width:100%; padding: 20px; background: #000; border:1px solid #A38C5D; border-radius: 20px;max-height: 90vh;overflow-y: auto;position: relative;animation: modalSlideUp 0.3s ease}
@keyframes modalSlideUp{from {transform: translateY(30px);opacity: 0;}
    to {transform: translateY(0);opacity: 1;}
}
.modal-close {position: absolute;cursor: pointer;background: none;border: none;width: 30px;height: 30px;transition: all 0.3s;z-index: 10;right: 20px;top: 20px; display: flex;align-items: center;justify-content: center}
.modal-close span {position: absolute; height: 1px;  width: 30px; display: block;background: #424242;border-radius: 2px;transition: all 0.3s}
.modal-close span:nth-child(1) {transform: rotate(45deg)}
.modal-close span:nth-child(2) {transform: rotate(-45deg)}
.modal-close:hover span{background: #A38C5D}
.modal-content-inner{}
/* ===== ЗАГОЛОВОК МОДАЛКИ ===== */
.modal-title{margin: 0 35px 25px 0; font:700 20px/29px 'Circe'; color: #FFFFFF}
/* ============================================================
   СПИСОК СОБЫТИЙ В МОДАЛКЕ
   ============================================================ */
.event-list-item{display: flex;padding: 15px;gap: 16px;background: #1A1A1A;border:1px solid #1A1A1A;border-radius: 15px;cursor: pointer;transition: all 0.2s;margin-bottom: 25px;flex-wrap: wrap;}
.event-list-item:hover{background: #282828; border-color: #373737;}
.event-list-title{width: calc(100% - 136px); font:700 16px/20px 'Circe'; color: #FFFFFF}
.event-list-image{width: 120px;height: 120px;flex-shrink: 0;border-radius: 10px;overflow: hidden}
.event-list-image picture, .event-list-image img{width: 100%;height: 100%;object-fit: cover;display: block}
.event-list-item:last-child{margin:0}
.event-list-info{width:100%; color: #fff; display: flex;justify-content: space-between;font: 700 16px/24px 'Circe'}
.event-list-price{transition: all 0.2s; text-align: right}
.event-list-link{transition: all 0.2s; gap:5px; display:flex; align-items:center; justify-content:end; font-size:12px}
.event-list-link span{transition: all 0.2s; transform: rotate(-45deg);}
.event-list-item:hover .event-list-link, .event-list-item:hover .event-list-price{color:#FF6600}
.event-list-item:hover .event-list-link span{transform: rotate(0);}
.has-places{color:#01E311}
.no-places{color:#FA0000}
.event-list-places{display:flex; gap:5px; align-items:center;}
.event-list-places::before{height: 5px; width:5px; border-radius:50px; margin: 1px 0 0 0;}
.event-list-places.has-places::before{background: #01E311; content:"";box-shadow: 0 0 4px 0px #01E311;}
.event-list-places.no-places::before{background: #FA0000; content:"";box-shadow: 0 0 4px 0px #FA0000;}
.event-list-link.no-places{opacity:0 !important}
.event-list-link.has-places{color:#fff}
.event-list-places.no-places.event-ended{color:#fff}
.event-list-places.no-places.event-ended::before{display:none}
/* ============================================================
   ДЕТАЛИ СОБЫТИЯ
   ============================================================ */
.event-detail-body{padding:15px; border-radius:15px; display:flex; flex-direction:column; gap:10px 0; background:#1A1A1A}   
.event-detail-description{padding:6px 0; font: 400 16px/20px 'Circe'; color: #FFFFFF}
.event-detail-description p{margin:0 0 10px}
.event-detail-description p:last-child{margin:0}
.event-detail-image {border-radius: 10px;overflow: hidden}
.event-detail-image picture, .event-detail-image img {width: 100%;height: auto;display: block}
.desc-toggle-btn {display: inline-block;margin: 10px 0;padding: 0;background: none;border: none;color: #fff;cursor: pointer;font-size: 14px;text-decoration: underline}
.desc-toggle-btn:hover {color: #FF6600;text-decoration: none}
.event-detail-button{display:flex; gap:10px; align-items:center}
.event-detail-button .btn-red{width:100%}
.event-detail-button .btn-border{width:auto}
.event-detail-footer{color: #969696; font: 400 16px/20px 'Circe'; text-align:center}
/* ============================================================
   ФОРМА ПОКУПКИ БИЛЕТА
   ============================================================ */
.ticket-form-title{margin: 0 0 20px 0; font-size: 20px; font-weight: 600; color: #2d3436; padding-right: 40px}
.ticket-event-info{padding: 14px 16px; background: #f8f9fa; border-radius: 10px; margin-bottom: 20px; border-left: 4px solid #667eea}
.ticket-event-info strong{display: block; font-size: 16px; color: #2d3436; margin-bottom: 4px}
.ticket-form-group{margin-bottom: 18px}
.ticket-form-group label{display: block; margin-bottom: 5px; font-weight: 600; color: #495057; font-size: 14px}
.ticket-form-group input, .ticket-form-group textarea{width: 100%; padding: 10px 14px; border: 2px solid #e9ecef; border-radius: 8px; font-size: 14px; transition: all 0.3s; box-sizing: border-box; font-family: inherit}
.ticket-form-group input:focus, .ticket-form-group textarea:focus{border-color: #667eea; outline: none; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1)}
.btn-submit{padding: 12px 20px; background: linear-gradient(135deg, #00b894 0%, #00a86b 100%); color: white; border: none; border-radius: 8px; font-size: 15px; font-weight: 500; cursor: pointer; transition: all 0.2s; flex: 2}
.btn-submit:hover{transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0, 184, 148, 0.4)}
.btn-submit:disabled{opacity: 0.6; cursor: not-allowed; transform: none}
.ticket-total{display:flex; align-items:center; min-height:44px; justify-content:space-between; font:700 16px/24px 'Circe';color: #FFFFFF}
.certificate-field{position: relative}
.certificate-input-wrap{display: flex; align-items: center; gap: 0; background: #282828; border-radius: 10px; transition: all 0.3s; overflow: hidden; border: 1px solid transparent}
.certificate-input-wrap:focus-within{box-shadow: 0 0 0 1px #A38C5D inset}
.certificate-icon{display: flex; align-items: center; justify-content: center; padding: 0 0 0 14px; flex-shrink: 0; color:#fff}
.certificate-icon svg{width: 24px; height: 24px; fill: none; stroke: currentColor}
input.certificate-input{flex: 1; height: 100%; background: transparent; padding: 0 10px; font: 400 16px 'Manrope', sans-serif; color: rgba(255, 255, 255, 0.8); border: none; outline: none; min-width: 0; box-shadow: none !important}
.certificate-input::placeholder{color: rgba(255, 255, 255, 0.25); opacity: 1}
.certificate-input:focus{color: #fff}
.inp_wrap form button.certificate-apply-btn{display: flex; align-items: center; gap: 6px; width:auto; height: 50px; padding: 0 18px; background: transparent; color: rgba(255,255,255,0.5);border: none;font: 500 16px 'Manrope', sans-serif;cursor: pointer;transition: all 0.2s;flex-shrink: 0;white-space: nowrap}
.inp_wrap form button.certificate-apply-btn svg {width: 20px;height: 20px;fill: none;stroke:currentColor}
.inp_wrap form button.certificate-apply-btn:hover {color: #c4a86a}
@media(min-width:768px){
	.next-month-link-cell__text-short{display:none}
}
@media(max-width:767px){
	.day-cell, .day-cell.empty, .day-cell.next-month-link-cell{min-height:70px}
	.next-month-link-cell__text-all{display:none}
}
@media(max-width:575px){
	.calendar-topbar{padding-bottom:25px}
	.calendar-days{gap:6px}
	.day-month, .events-count__text, .day-events-count i{display:none}
	.day-wrap, .day-events-count{justify-content:center}
	.day-cell, .day-cell.empty, .day-cell.next-month-link-cell{min-height:55px; border-radius:10px}
	.day-cell {padding:8px}
	.calendar-weekdays{padding:6px 0}
	.next-month-link{flex-direction:column; display:flex; align-items:center; justify-content:center}
	.next-month-link-cell__text-short{order:2}
	.day-cell.today::after {padding: 0px 2px 1px; font: 400 10px/1 'Circe'; top: -5px; right: -5px}
	.calendar-topbar > div:nth-child(2){display:none}
}
@media(max-width:575px){
	.modal-title{font:700 18px/20px 'Manrope'; margin:0 35px 15px 0;}
	.modal-box{padding: 15px; border-radius: 10px;}
	.modal-close{width: 25px;height: 25px;right: 10px;top: 10px}
	.modal-close span{width:25px}
	.event-list-image {width: 100px;height: 100px}
	.event-list-item {padding: 10px; gap: 15px; border-radius: 10px; margin-bottom: 15px}
	.event-list-title{width: calc(100% - 115px)}
	.event-list-info, .event-list-title{font: 700 14px/18px 'Circe';}
	.event-detail-body {padding: 10px;border-radius: 10px}
	.event-detail-description, .event-detail-footer{font:14px/18px 'Circe';}
	.desc-toggle-btn{font-size:12px}
}
@media(max-width:350px){
	.certificate-icon{display:none}
}