/*
 * Rejestracja Wizyt - wspólny motyw modułu pacjenta i komponentu lekarza
 * Wartości są przekazywane przez zmienne CSS z konfiguracji Joomla.
 */

.com-rejestracja-panel,
.mod-rezerwacje,
body > #mr-modal,
body > #mr-month-modal {
    --theme-primary: #0073b9;
    --theme-primary-hover: #005f9b;
    --theme-text: #222222;
    --theme-muted: #777777;
    --theme-page-bg: transparent;
    --theme-surface: #ffffff;
    --theme-border: #dddddd;
    --theme-empty-bg: #eeeeee;
    --theme-free: #dceef8;
    --theme-free-text: #0073b9;
    --theme-booked: #0073b9;
    --theme-booked-text: #ffffff;
    --theme-blocked: #777777;
    --theme-blocked-text: #ffffff;
    --theme-font-family: 'Comfortaa', Arial, sans-serif;
    --theme-font-size: 14px;
    --theme-heading-size: 30px;
    --theme-radius: 0px;
    --theme-panel-width: 92vw;
    --theme-panel-max-width: 1500px;
    --theme-panel-margin-y: 28px;
    --theme-mobile-margin-x: 12px;
    --theme-grid-gap: 12px;
    --theme-slot-gap: 6px;
    --theme-control-height: 46px;
    --theme-modal-width: 480px;
    --theme-density: 1;

    /* aliasy zgodne ze starszym CSS */
    --primary: var(--theme-primary);
    --primary-dark: var(--theme-primary-hover);
    --free: var(--theme-free);
    --free-slot: var(--theme-free);
    --blocked-slot: var(--theme-blocked);
    --gray-dark: var(--theme-muted);
    --white: var(--theme-surface);
    --border: var(--theme-border);

    color: var(--theme-text) !important;
    font-family: var(--theme-font-family) !important;
    font-size: var(--theme-font-size) !important;
}

.com-rejestracja-panel,
.mod-rezerwacje {
    width: var(--theme-panel-width) !important;
    max-width: var(--theme-panel-max-width) !important;
    margin: var(--theme-panel-margin-y) auto !important;
    background: var(--theme-page-bg) !important;
}

.com-rejestracja-panel *,
.mod-rezerwacje *,
body > #mr-modal *,
body > #mr-month-modal * {
    border-radius: var(--theme-radius) !important;
    font-family: inherit;
}

.com-rejestracja-panel .doctor-main-title,
.mod-rezerwacje .mr-header-left h1 {
    color: var(--theme-primary) !important;
    font-size: var(--theme-heading-size) !important;
}

/* Nawigacja */
.com-rejestracja-panel .doctor-calendar-navigation,
.mod-rezerwacje .mr-calendar-navigation {
    gap: var(--theme-grid-gap) !important;
}

.com-rejestracja-panel .calendar-arrow,
.com-rejestracja-panel .calendar-title-button,
.com-rejestracja-panel .gabinet-btn,
.com-rejestracja-panel .work-hours-open-btn,
.com-rejestracja-panel .logout-btn,
.mod-rezerwacje .mr-calendar-arrow,
.mod-rezerwacje .mr-calendar-title-button,
.mod-rezerwacje .mr-gabinet-btn {
    min-height: var(--theme-control-height) !important;
    background: var(--theme-primary) !important;
    color: #fff !important;
    border-color: var(--theme-primary) !important;
}

.com-rejestracja-panel .calendar-arrow:hover,
.com-rejestracja-panel .calendar-title-button:hover,
.com-rejestracja-panel .gabinet-btn:hover,
.com-rejestracja-panel .work-hours-open-btn:hover,
.com-rejestracja-panel .logout-btn:hover,
.mod-rezerwacje .mr-calendar-arrow:hover,
.mod-rezerwacje .mr-calendar-title-button:hover,
.mod-rezerwacje .mr-gabinet-btn:hover {
    background: var(--theme-primary-hover) !important;
    border-color: var(--theme-primary-hover) !important;
}

/* Siatka kalendarza */
.com-rejestracja-panel .doctor-week-grid,
.mod-rezerwacje .mr-week-grid {
    gap: var(--theme-grid-gap) !important;
}

.com-rejestracja-panel .doctor-day-header,
.mod-rezerwacje .mr-day-header {
    background: var(--theme-primary) !important;
    color: #fff !important;
    padding: calc(10px * var(--theme-density)) !important;
}

.com-rejestracja-panel .doctor-work-hours,
.mod-rezerwacje .mr-work-hours {
    color: var(--theme-primary) !important;
    border-color: var(--theme-border) !important;
    background: var(--theme-surface) !important;
}

.com-rejestracja-panel .doctor-empty,
.mod-rezerwacje .mr-empty {
    color: var(--theme-muted) !important;
    background: var(--theme-empty-bg) !important;
}

/* Terminy */
.com-rejestracja-panel .doctor-slot,
.mod-rezerwacje .mr-slot-btn {
    margin-bottom: var(--theme-slot-gap) !important;
    padding: calc(10px * var(--theme-density)) !important;
}

.com-rejestracja-panel .doctor-slot-free,
.mod-rezerwacje .mr-slot-btn {
    background: var(--theme-free) !important;
    color: var(--theme-free-text) !important;
}

.com-rejestracja-panel .doctor-slot-free:hover,
.mod-rezerwacje .mr-slot-btn:hover {
    background: var(--theme-primary-hover) !important;
    color: #fff !important;
}

.com-rejestracja-panel .doctor-slot-visit {
    background: var(--theme-booked) !important;
    color: var(--theme-booked-text) !important;
}

.com-rejestracja-panel .doctor-slot-blocked {
    background: var(--theme-blocked) !important;
    color: var(--theme-blocked-text) !important;
}

/* Nagłówek modułu pacjenta */
.mod-rezerwacje .mr-header-right,
.mod-rezerwacje .mr-address {
    color: var(--theme-muted) !important;
}
.mod-rezerwacje .mr-header-right a,
.mod-rezerwacje .mr-price {
    color: var(--theme-primary) !important;
}

/* Modale */
.com-rejestracja-panel .cr-modal-content,
body > #mr-modal .mr-modal-content,
body > #mr-month-modal .mr-month-modal-content {
    width: min(var(--theme-modal-width), calc(100vw - 32px)) !important;
    max-width: min(var(--theme-modal-width), calc(100vw - 32px)) !important;
    background: var(--theme-surface) !important;
    color: var(--theme-text) !important;
}

.com-rejestracja-panel .cr-modal-header,
body > #mr-modal .mr-modal-header,
body > #mr-month-modal .mr-modal-header {
    background: var(--theme-primary) !important;
    color: #fff !important;
}

.com-rejestracja-panel input,
.com-rejestracja-panel select,
.com-rejestracja-panel textarea,
body > #mr-modal input,
body > #mr-modal select,
body > #mr-modal textarea {
    border-color: var(--theme-primary) !important;
    color: var(--theme-text) !important;
    background: var(--theme-surface) !important;
    font-size: calc(var(--theme-font-size) + 2px) !important;
}

.com-rejestracja-panel button[type='submit'],
body > #mr-modal button[type='submit'],
body > #mr-modal .mr-modal-message button {
    background: var(--theme-primary) !important;
    color: #fff !important;
    border-color: var(--theme-primary) !important;
}

.com-rejestracja-panel button[type='submit']:hover,
body > #mr-modal button[type='submit']:hover,
body > #mr-modal .mr-modal-message button:hover {
    background: var(--theme-primary-hover) !important;
}

/* Modal miesięczny */
body > #mr-month-modal .mr-month-day.is-available,
.com-rejestracja-panel .month-day.is-available {
    background: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: #fff !important;
}
body > #mr-month-modal .mr-month-day.is-available:hover,
.com-rejestracja-panel .month-day.is-available:hover {
    background: var(--theme-primary-hover) !important;
}

@media (max-width: 700px) {
    .com-rejestracja-panel,
    .mod-rezerwacje {
        width: calc(100% - (2 * var(--theme-mobile-margin-x))) !important;
        max-width: none !important;
        margin: 16px auto !important;
    }

    .com-rejestracja-panel .doctor-main-title,
    .mod-rezerwacje .mr-header-left h1 {
        font-size: calc(var(--theme-heading-size) * .82) !important;
    }

    .com-rejestracja-panel .cr-modal-content,
    body > #mr-modal .mr-modal-content,
    body > #mr-month-modal .mr-month-modal-content {
        width: calc(100vw - (2 * var(--theme-mobile-margin-x))) !important;
        max-width: none !important;
    }
}


/* ================================================================
   v1.2.2 — wspólna konfiguracja motywu komponentu i modułu
   ================================================================ */

/* Szerokość jest liczona względem okna, a nie ograniczonego kontenera
   szablonu Joomla. Ustawienia panel_width i panel_max_width działają
   niezależnie od szerokości pozycji komponentu w szablonie. */
.com-rejestracja-panel {
    width: min(var(--theme-panel-width), var(--theme-panel-max-width)) !important;
    max-width: none !important;
    margin-top: var(--theme-panel-margin-y) !important;
    margin-bottom: var(--theme-panel-margin-y) !important;
    margin-left: 50% !important;
    margin-right: 0 !important;
    position: relative !important;
    transform: translateX(-50%) !important;
}

/* Jedna nawigacja dla danego typu urządzenia. Te reguły celowo są
   na końcu pliku, aby wygrać z historycznymi regułami panel-v111.css. */
.com-rejestracja-panel .desktop-only-calendar {
    display: block !important;
}
.com-rejestracja-panel .mobile-only-calendar {
    display: none !important;
}
.com-rejestracja-panel .doctor-calendar-navigation.desktop-only-calendar {
    display: grid !important;
    grid-template-columns: var(--theme-control-height) minmax(0, 1fr) var(--theme-control-height) !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    gap: var(--theme-grid-gap) !important;
}
.com-rejestracja-panel .doctor-calendar-navigation .calendar-arrow {
    width: var(--theme-control-height) !important;
    min-width: var(--theme-control-height) !important;
    height: var(--theme-control-height) !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}
.com-rejestracja-panel .doctor-calendar-navigation .calendar-title-button {
    width: 100% !important;
    min-width: 0 !important;
    height: var(--theme-control-height) !important;
    margin: 0 !important;
}

/* Ustawienia odstępów i gęstości. */
.com-rejestracja-panel .doctor-calendar-grid {
    gap: var(--theme-grid-gap) !important;
}
.com-rejestracja-panel .doctor-slot {
    margin-bottom: var(--theme-slot-gap) !important;
}
.com-rejestracja-panel .doctor-day-header,
.com-rejestracja-panel .doctor-work-hours,
.com-rejestracja-panel .doctor-empty,
.com-rejestracja-panel .doctor-slot {
    padding-top: calc(8px * var(--theme-density)) !important;
    padding-bottom: calc(8px * var(--theme-density)) !important;
}

@media (max-width: 700px) {
    .com-rejestracja-panel {
        width: calc(100vw - (2 * var(--theme-mobile-margin-x))) !important;
        max-width: none !important;
        margin-top: 16px !important;
        margin-bottom: 16px !important;
        margin-left: 50% !important;
        margin-right: 0 !important;
        transform: translateX(-50%) !important;
    }
    .com-rejestracja-panel .desktop-only-calendar {
        display: none !important;
    }
    .com-rejestracja-panel .mobile-only-calendar {
        display: block !important;
    }
    .com-rejestracja-panel .doctor-calendar-navigation.mobile-only-calendar {
        display: grid !important;
        grid-template-columns: var(--theme-control-height) minmax(0, 1fr) var(--theme-control-height) !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        gap: var(--theme-grid-gap) !important;
    }
}

/* ================================================================
   v1.2.3 / v2.1.2 — jednoznaczna nawigacja responsywna
   Desktop: zakres tygodnia. Mobile/tablet: pojedyncza data.
   Reguły są na końcu arkusza, aby nadpisać historyczne breakpointy.
   ================================================================ */
@media (min-width: 901px) {
    .com-rejestracja-panel .desktop-only-calendar {
        display: block !important;
    }
    .com-rejestracja-panel .mobile-only-calendar {
        display: none !important;
    }
    .com-rejestracja-panel .doctor-calendar-navigation.desktop-only-calendar {
        display: grid !important;
        grid-template-columns: var(--theme-control-height) minmax(0, 1fr) var(--theme-control-height) !important;
        align-items: center !important;
        width: 100% !important;
    }

    .mod-rezerwacje .mr-desktop-calendar {
        display: block !important;
    }
    .mod-rezerwacje .mr-mobile-calendar {
        display: none !important;
    }
}

@media (max-width: 900px) {
    .com-rejestracja-panel .desktop-only-calendar {
        display: none !important;
    }
    .com-rejestracja-panel .mobile-only-calendar {
        display: block !important;
    }
    .com-rejestracja-panel .doctor-calendar-navigation.mobile-only-calendar {
        display: grid !important;
        grid-template-columns: var(--theme-control-height) minmax(0, 1fr) var(--theme-control-height) !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        gap: var(--theme-grid-gap) !important;
    }

    .mod-rezerwacje .mr-desktop-calendar {
        display: none !important;
    }
    .mod-rezerwacje .mr-mobile-calendar {
        display: block !important;
    }
    .mod-rezerwacje .mr-calendar-navigation.mr-mobile-nav {
        display: grid !important;
        grid-template-columns: var(--theme-control-height) minmax(0, 1fr) var(--theme-control-height) !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        gap: var(--theme-grid-gap) !important;
    }
}
