/* --- WP Eszközbérlés Rendszer Stíluslap --- */

/* Általános Segédosztályok */
.wper-wrapper { background: #fff; padding: 20px; border: 1px solid #ccd0d4; border-radius: 4px; max-width: 800px; margin-top: 20px; }
.wper-text-success { color: #166534; }
.wper-text-danger { color: #b91c1c; }
.wper-text-info { color: #0284c7; }
.wper-bold { font-weight: bold; }
.wper-mt-20 { margin-top: 20px; }

/* 1. ADMIN DASHBOARD (Vezérlőpult) */
.wper-dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-bottom: 30px; }
.wper-dash-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); display: flex; align-items: center; overflow: hidden; }
.wper-card-icon { width: 50px; height: 50px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; margin-right: 15px; flex-shrink: 0; }
.wper-icon-revenue { background: #dcfce7; color: #16a34a; }
.wper-icon-active { background: #e0f2fe; color: #0284c7; }
.wper-icon-completed { background: #f1f5f9; color: #475569; }
.wper-icon-cancelled { background: #fee2e2; color: #dc2626; }
.wper-card-data h4 { margin: 0; color: #64748b; font-size: 13px; font-weight: 600; text-transform: uppercase; }
.wper-card-data p { margin: 5px 0 0 0; font-size: 24px; font-weight: bold; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wper-table-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.wper-table-header { margin-top:0; border-bottom: 2px solid #f1f5f9; padding-bottom: 10px; }
.wper-table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100%; border-radius: 4px; }

/* 2. ADMIN FOGLALÁS RÉSZLETEI (Meta Box) */
.wper-booking-details-table { width: 100%; text-align: left; border-collapse: collapse; font-size: 14px; table-layout: fixed; }
.wper-booking-details-table th { width: 35%; padding: 12px 10px; word-wrap: break-word; vertical-align: top; color: #334155; border-bottom: 1px solid #ddd; }
.wper-booking-details-table td { width: 65%; padding: 12px 10px; word-wrap: break-word; overflow-wrap: break-word; vertical-align: top; color: #0f172a; border-bottom: 1px solid #ddd; }
.wper-status-row { border-bottom: 2px solid #0ea5e9; background:#f8fafc; }
.wper-status-select { width: 100%; max-width: 100%; box-sizing: border-box; padding: 6px; border-radius: 4px; font-weight: bold; font-size: 14px; border: 1px solid #cbd5e1; height: auto; white-space: normal; }
.wper-gmaps-btn { display: inline-block; margin-top: 5px; background: #22c55e; color: white; padding: 8px 10px; border-radius: 4px; text-decoration: none; font-size: 12px; text-align: center; max-width: 100%; box-sizing: border-box; white-space: normal; line-height: 1.4; }
.wper-gmaps-btn:hover { color: white; background: #16a34a; }
.wper-info-badge { padding:3px 8px; border-radius:4px; display:inline-block; }
.wper-badge-blue { background:#e0f2fe; color:#0369a1; }
.wper-badge-red { background:#fee2e2; color:#b91c1c; }

@media (max-width: 600px) {
    .wper-booking-details-table, .wper-booking-details-table tbody, .wper-booking-details-table tr, .wper-booking-details-table th, .wper-booking-details-table td { display: block; width: 100%; box-sizing: border-box; }
    .wper-booking-details-table tr { border-bottom: 1px solid #e2e8f0 !important; margin-bottom: 8px; padding-bottom: 8px; }
    .wper-booking-details-table th { padding-bottom: 2px; border-bottom: none !important; font-size: 12px; color: #64748b; }
    .wper-booking-details-table td { padding-top: 2px; border-bottom: none !important; }
    .wper-status-select { font-size: 13px; }
}

/* 3. PUBLIC BOOKING FORM (Űrlap) */
.wper-booking-wrapper { background-color: #ffffff; padding: 30px; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05); font-family: inherit; overflow: hidden; box-sizing: border-box; margin-bottom: 30px; }
.wper-form-title { margin-top: 0; color: #0f172a; font-size: 24px; font-weight: 800; margin-bottom: 25px; text-align: center; }
.wper-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; box-sizing: border-box; }
.wper-input-group { margin-bottom: 20px; }
.wper-input-group label { display: block; font-weight: 600; color: #334155; margin-bottom: 8px; font-size: 14px; }
.wper-input { width: 100%; padding: 12px 15px; border: 2px solid #e2e8f0; border-radius: 8px; background-color: #f8fafc; font-size: 16px; color: #0f172a; transition: all 0.3s; box-sizing: border-box; }
.wper-input:focus { outline: none; border-color: #0ea5e9; background-color: #ffffff; box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1); }
.wper-time-flex { display: flex; gap: 15px; margin-top: 15px; }
.wper-time-flex > div { flex: 1; }
.wper-legend { display: flex; gap: 10px; font-size: 12px; justify-content: center; flex-wrap: wrap; padding: 15px 0; background: #f8fafc; border-radius: 8px; margin-top: 15px; }
.wper-legend span { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.wper-price-box { background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%); border: 1px solid #bbf7d0; border-radius: 8px; padding: 20px; margin-bottom: 20px; text-align: center; }
.wper-price-box p { margin: 0; font-size: 14px; color: #166534; }
.wper-price-box strong { display: block; font-size: 28px; color: #15803d; margin: 5px 0; }
.wper-submit-btn { width: 100%; background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%); color: #ffffff; border: none; padding: 16px 20px; font-size: 18px; font-weight: bold; border-radius: 8px; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 6px -1px rgba(14, 165, 233, 0.4); box-sizing: border-box; }
.wper-submit-btn:disabled { background: #cbd5e1; color: #94a3b8; cursor: not-allowed; box-shadow: none; transform: none; }
.wper-submit-btn:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(14, 165, 233, 0.4); }
.wper-info-box { background-color: #f8fafc; padding: 25px; border-radius: 12px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); border: 1px solid #e2e8f0; margin-bottom: 30px; }
.wper-info-title { margin-top: 0; color: #0f172a; font-size: 20px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.wper-info-list { list-style: none; padding: 0; margin: 0; color: #475569; }
.wper-info-list li { margin-bottom: 10px; }
.wper-price-highlight { color:#0ea5e9; font-weight:bold; font-size:18px; }

/* Flatpickr Override (Naptár színek és méretek) */

/* EZ A RÉSZ CSAK A FRONTEND FOGLALÁSI ŰRLAPON ÉRVÉNYESÜL */
.wper-booking-wrapper .flatpickr-calendar { 
    width: 100% !important; 
    max-width: 100% !important; 
    box-shadow: none !important; 
    border: 1px solid #e2e8f0 !important; 
    border-radius: 8px !important; 
    padding: 10px !important; 
    box-sizing: border-box; 
}

/* EZ A RÉSZ GLOBÁLIS (Adminban is működik) - csak a színek */
.flatpickr-day.status-free:not(.selected):not(.inRange) { background-color: #dcfce7 !important; border-color: #dcfce7 !important; color: #166534 !important; }
.flatpickr-day.status-partial:not(.selected):not(.inRange) { background-color: #ffedd5 !important; border-color: #ffedd5 !important; color: #9a3412 !important; }
.flatpickr-day.status-full:not(.selected):not(.inRange) { background-color: #fee2e2 !important; border-color: #fee2e2 !important; color: #b91c1c !important; }
.flatpickr-day.status-full { pointer-events: none; opacity: 0.5; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.status-past { background-color: #f8fafc !important; border-color: transparent !important; color: #cbd5e1 !important; pointer-events: none; }
.flatpickr-day.day-invalid { cursor: not-allowed !important; pointer-events: auto !important; opacity: 0.5; background-color: #fee2e2 !important; color: #b91c1c !important;}

/* MOBIL NÉZET - CSAK AZ ŰRLAPRA KORLÁTOZVA */
@media (max-width: 768px) { 
    .wper-form-grid { grid-template-columns: 1fr; gap: 20px; } 
    .wper-booking-wrapper { padding: 15px 10px; } 
    .wper-time-flex { flex-direction: column; gap: 10px; }
    #wp_er_booking_form input, #wp_er_booking_form select { font-size: 16px !important; padding: 12px !important; } 
    
    /* A naptár limitálása mobilon */
    .wper-booking-wrapper .flatpickr-calendar { max-width: 340px !important; margin: 0 auto !important; } 
    .wper-booking-wrapper .flatpickr-innerContainer, 
    .wper-booking-wrapper .flatpickr-rContainer, 
    .wper-booking-wrapper .dayContainer, 
    .wper-booking-wrapper .flatpickr-days { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } 
    .wper-booking-wrapper .flatpickr-day { max-width: 13.5% !important; height: 38px !important; line-height: 38px !important; }
}