:root {
    --navy: #1e3a5f;
    --navy-light: #2c5282;
    --gold: #d4af37;
    --gold-light: #e8c96f;
    --red: #8b0000;
    --white: #fff;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-600: #6c757d;
    --radius: 12px;
    --shadow: 0 4px 20px rgba(30,58,95,0.15);
}

.maf-rea-frontend-modern,.maf-rea-admin-dash{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;max-width:1400px;margin:0 auto;padding:20px}

/* HERO */
.rea-hero{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-light) 100%);color:var(--white);padding:60px 40px;border-radius:var(--radius);text-align:center;margin-bottom:40px;box-shadow:var(--shadow)}
.rea-hero-title{font-size:2.5rem;font-weight:700;margin:0 0 10px}
.rea-hero-subtitle{font-size:1.2rem;opacity:0.9;margin:0}

/* CALENDARIO MODERNO */
.rea-calendar-modern{background:var(--white);padding:30px;border-radius:var(--radius);box-shadow:var(--shadow)}
.rea-cal-header{display:flex;justify-content:flex-end;margin-bottom:20px}
.rea-legend{display:flex;gap:20px}
.rea-legend-item{display:flex;align-items:center;gap:8px;font-size:14px}
.rea-dot{width:16px;height:16px;border-radius:50%}
.rea-dot.available{background:var(--navy);border:2px solid var(--gold)}
.rea-dot.booked{background:var(--red)}

#rea-calendar-modern{min-height:600px}
.fc-event{cursor:pointer!important;transition:all 0.2s}
.fc-event:hover{opacity:0.85;transform:translateY(-2px)}
.rea-slot-booked{pointer-events:none!important;cursor:default!important;opacity:0.7}

/* MODAL */
.rea-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.rea-modal-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(30,58,95,0.85);backdrop-filter:blur(4px)}
.rea-modal-box{position:relative;background:var(--white);border-radius:var(--radius);max-width:600px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px rgba(0,0,0,0.3);animation:modalIn 0.3s}
@keyframes modalIn{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}

.rea-modal-close{position:absolute;top:20px;right:20px;background:none;border:none;font-size:28px;cursor:pointer;color:var(--gray-600);transition:color 0.2s}
.rea-modal-close:hover{color:var(--navy)}

.rea-modal-header{padding:30px 30px 20px;border-bottom:2px solid var(--gray-200)}
.rea-modal-header h3{margin:0 0 10px;font-size:1.8rem;color:var(--navy)}
.rea-modal-header p{margin:0;color:var(--gray-600)}

/* FORM */
.rea-form{padding:30px}
.rea-field{margin-bottom:20px}
.rea-field label{display:block;font-weight:600;color:var(--navy);margin-bottom:8px}
.rea-field input,.rea-field textarea,.rea-field select,.rea-select{width:100%;padding:12px 16px;border:2px solid var(--gray-200);border-radius:8px;font-size:1rem;transition:all 0.2s}
.rea-field input:focus,.rea-field textarea:focus,.rea-field select:focus,.rea-select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,175,55,0.2)}
.rea-field textarea{resize:vertical;font-family:inherit}

.rea-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:20px}
.rea-btn{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all 0.3s}
.rea-btn-primary{background:linear-gradient(135deg,var(--navy),var(--navy-light));color:var(--white)}
.rea-btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(30,58,95,0.4)}
.rea-btn-secondary{background:var(--gray-200);color:var(--gray-600)}
.rea-btn-secondary:hover{background:var(--gray-600);color:var(--white)}
.rea-btn-danger{background:var(--red);color:var(--white)}
.rea-btn-danger:hover{background:#660000}
.rea-btn.loading .rea-btn-text{display:none}
.rea-btn.loading .rea-btn-loader{display:inline}
.rea-btn-loader{display:none}

/* DASHBOARD ADMIN */
.rea-admin-header{text-align:center;margin-bottom:40px}
.rea-admin-header h1{font-size:2.5rem;color:var(--navy);margin:0 0 10px}
.rea-admin-header p{color:var(--gray-600);margin:0}

.rea-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:40px}
.rea-stat-card{background:linear-gradient(135deg,var(--navy),var(--navy-light));color:var(--white);padding:30px;border-radius:var(--radius);box-shadow:var(--shadow);text-align:center}
.rea-stat-card span{display:block;opacity:0.9;margin-bottom:10px}
.rea-stat-card strong{display:block;font-size:3rem;font-weight:700}

.rea-section{background:var(--white);padding:30px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:30px}
.rea-section h2{margin:0 0 20px;color:var(--navy);font-size:1.8rem}
.rea-empty{text-align:center;padding:40px;color:var(--gray-600)}

.rea-bookings-list{display:flex;flex-direction:column;gap:15px}
.rea-booking-card{display:flex;align-items:center;gap:20px;padding:20px;background:var(--gray-100);border-radius:var(--radius);border-left:4px solid var(--gold);transition:all 0.2s}
.rea-booking-card:hover{background:var(--gray-200);transform:translateX(5px)}
.rea-booking-card.past{opacity:0.7;border-left-color:var(--gray-600)}

.rea-date-badge{background:var(--navy);color:var(--white);padding:10px;border-radius:8px;text-align:center;min-width:60px}
.rea-date-badge.past{background:var(--gray-600)}
.rea-date-badge .day{display:block;font-size:1.5rem;font-weight:700}
.rea-date-badge .month{display:block;font-size:0.9rem;text-transform:uppercase}

.rea-details{flex:1}
.rea-details h3{margin:0 0 8px;font-size:1.2rem;color:var(--navy)}
.rea-details p{margin:4px 0;color:var(--gray-600)}
.rea-contact{font-size:0.9rem}

.rea-actions-mini{display:flex;gap:8px}
.rea-btn-icon{width:36px;height:36px;border:none;border-radius:6px;background:var(--white);cursor:pointer;font-size:18px;transition:all 0.2s}
.rea-btn-icon:hover{background:var(--navy);color:var(--white)}
.rea-btn-text{padding:8px 16px;border:none;border-radius:6px;background:var(--navy);color:var(--white);cursor:pointer;font-size:0.9rem;font-weight:600;transition:all 0.2s}
.rea-btn-text:hover{background:var(--navy-light);transform:translateY(-1px)}
.rea-btn-danger-text{background:var(--red)}
.rea-btn-danger-text:hover{background:#660000}

/* CALENDARIO ADMIN */
.rea-calendar-admin-wrapper{margin-top:20px}
.rea-legend-admin{display:flex;gap:20px;margin-bottom:15px;flex-wrap:wrap}
.rea-legend-item-admin{display:flex;align-items:center;gap:8px;font-size:14px}
#rea-calendar-admin{min-height:600px}

/* AVAILABILITY */
.rea-availability label{display:block;font-weight:600;color:var(--navy);margin-bottom:8px}
.rea-input{padding:12px;border:2px solid var(--gray-200);border-radius:8px;margin-bottom:20px;max-width:300px}
.rea-input:focus{outline:none;border-color:var(--gold)}

.rea-timeslots{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;margin-bottom:20px}
.rea-timeslot{padding:12px;border:2px solid var(--gray-200);border-radius:8px;text-align:center;cursor:pointer;transition:all 0.2s;background:var(--white)}
.rea-timeslot:hover{border-color:var(--gold);background:var(--gray-100)}
.rea-timeslot.selected{background:var(--navy);color:var(--white);border-color:var(--gold)}

/* TOAST */
.rea-toast-container{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:12px}
.rea-toast{background:var(--white);padding:16px 20px;border-radius:8px;box-shadow:var(--shadow);display:flex;align-items:center;gap:12px;animation:toastIn 0.3s;border-left:4px solid}
.rea-toast.success{border-left-color:#28a745}
.rea-toast.error{border-left-color:var(--red)}
@keyframes toastIn{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}

@media(max-width:768px){
    .rea-hero-title{font-size:2rem}
    .rea-booking-card{flex-direction:column;align-items:flex-start}
    .rea-stats{grid-template-columns:1fr}
}