/* Serenity Booking - Admin Pages CSS */

/* ── Page background ──────────────────────────────────────── */
body.toplevel_page_serenity-booking,
body.booking_page_serenity-booking-locations,
body.booking_page_serenity-holidays,
body.booking_page_serenity-booking-settings,
body.booking_page_serenity-booking-services,
body.post-type-serb_location,
body.post-type-serb_holiday,
body.post-type-serenity_booking_service {
    background: #f8f9fa;
}

/* ── RESET: Remove any gradient/color from parent menu item ── */
/* These rules MUST come before the submenu rules to override cache */
#adminmenu li#toplevel_page_serenity-booking > a,
#adminmenu li#toplevel_page_serenity-booking.wp-has-current-submenu > a,
#adminmenu li#toplevel_page_serenity-booking.wp-menu-open > a,
body.toplevel_page_serenity-booking #adminmenu li#toplevel_page_serenity-booking > a,
body.booking_page_serenity-booking-locations #adminmenu li#toplevel_page_serenity-booking > a,
body.booking_page_serenity-booking-settings #adminmenu li#toplevel_page_serenity-booking > a,
body.booking_page_serenity-booking-services #adminmenu li#toplevel_page_serenity-booking > a,
body.booking_page_serenity-holidays #adminmenu li#toplevel_page_serenity-booking > a {
    background: none !important;
    background-image: none !important;
    border-radius: 0 !important;
}

/* ── RESET: Remove gradient from first submenu item (Dashboard) ── */
#adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a,
#adminmenu li#toplevel_page_serenity-booking .wp-submenu li.wp-first-item > a,
body.toplevel_page_serenity-booking #adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a,
body.booking_page_serenity-booking-locations #adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a,
body.booking_page_serenity-booking-settings #adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a,
body.booking_page_serenity-booking-services #adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a,
body.booking_page_serenity-holidays #adminmenu li#toplevel_page_serenity-booking .wp-submenu li.current > a {
    background: rgba(255,255,255,0.08) !important;
    background-image: none !important;
    color: #e9d5ff !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
}

/* ── Submenu container ────────────────────────────────────── */
#adminmenu li#toplevel_page_serenity-booking .wp-submenu {
    background: #1e1b2e !important;
    background-image: none !important;
    border-radius: 0 0 6px 6px;
    padding: 4px 0 8px !important;
}

/* ── All submenu links ────────────────────────────────────── */
#adminmenu li#toplevel_page_serenity-booking .wp-submenu a {
    color: #c4b5fd !important;
    padding: 7px 10px 7px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border-radius: 4px !important;
    margin: 1px 6px !important;
    transition: background 0.15s ease, color 0.15s ease !important;
    display: block !important;
    background: none !important;
}

/* ── Submenu hover ────────────────────────────────────────── */
#adminmenu li#toplevel_page_serenity-booking .wp-submenu a:hover {
    color: #ffffff !important;
    background: rgba(168, 85, 247, 0.25) !important;
}

/* ── General WP admin tweaks ──────────────────────────────── */
.notice { border-radius: 6px; }
.notice-success { border-left-color: #10b981; }
.notice-error   { border-left-color: #ef4444; }
.notice-warning { border-left-color: #f59e0b; }

/* ============================================
   INLINE STYLE REPLACEMENTS
   Classes below replace inline style= attributes in admin view templates
   to comply with CodeCanyon CSS standards (no inline CSS in markup).
   ============================================ */

/* Location add/edit — image upload area */
.serenity-hint {
    color: #6B7280;
    font-size: 13px;
    display: block;
    margin-top: 4px;
}

.serenity-image-preview-wrap {
    margin-bottom: 12px;
}

.serenity-image-preview-img,
.serenity-image-preview-wrap img {
    max-width: 300px;
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
    border: 2px solid #E5E7EB;
    display: block;
}

.serenity-upload-row {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.serenity-upload-icon {
    vertical-align: middle;
    margin-top: -2px;
}

.serenity-remove-btn {
    color: #dc2626;
}

/* Service add/edit — form group flex variants */
.serenity-form-group-fixed {
    flex: 0 0 40%;
}

.serenity-form-group-grow {
    flex: 1;
}

.serenity-field-hint {
    margin: 5px 0 0 0;
    font-size: 13px;
    color: #666;
}

/* Service icon display in card listing */
.serenity-service-icon-img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 6px;
}

.serenity-service-icon-emoji {
    font-size: 32px;
}

.serenity-new-category-input {
    margin-top: 10px;
}

.serenity-form-group-fixed {
    flex: 0 0 40%;
}

.serenity-form-group-grow {
    flex: 1;
}

/* JS-toggled hidden state — replaces inline style="display:none" */
.serenity-modal-hidden {
    display: none;
}

/* Service edit — icon row layout */
.serenity-icon-row {
    display: flex;
    gap: 15px;
    align-items: center;
}

.serenity-icon-input-wrap {
    flex: 1;
}

.serenity-icon-preview {
    font-size: 48px;
    min-width: 60px;
    text-align: center;
}

.serenity-icon-preview-img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
}

/* Locations list — no-hours warning text */
.serenity-no-hours-warning {
    color: #ef4444;
}

/* Settings page layout helpers */
.serenity-notice-inline {
    margin: 10px 0;
}

.serenity-section-divider {
    margin: 24px 0;
    border: none;
    border-top: 1px solid #e5e7eb;
}

.serenity-section-heading {
    margin-bottom: 16px;
}

.serenity-section-heading-sm {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}

.serenity-description-mt {
    margin-top: 6px;
}

.serenity-code-block {
    display: block;
    padding: 10px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    word-break: break-all;
}