/**
 * Auto Business Hours - Frontend Styles
 *
 * Visual values are driven by CSS custom properties so they can be overridden
 * in two places without duplicating any rules:
 *   1. Globally  - the admin "Appearance" settings emit a `.abh-wrapper { ... }`
 *                  rule via wp_add_inline_style().
 *   2. Per use   - shortcode attributes set the same variables inline on the
 *                  individual wrapper element (style="--abh-...:...").
 *
 * Every property uses a `var(--abh-*, fallback)` so the stylesheet remains
 * self-sufficient (and theme/dark-mode friendly) when nothing is customized.
 *
 * @package AutoBusinessHours
 */

/* Main Wrapper. No outer margin: spacing around the hours block belongs to
   the theme/page builder container it sits in. */
.abh-wrapper {
    line-height: 1.6;
    color: var(--abh-text-color, inherit);
    background: var(--abh-bg-color, transparent);
    text-align: var(--abh-text-align, left);
}

/* List Format */
.abh-list {
    padding: 5px;
}

.abh-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.abh-item {
    padding: var(--abh-row-spacing, 10px) 0;
    font-size: var(--abh-font-size, 16px);
    color: var(--abh-text-color, inherit);
    border-bottom: var(--abh-divider, none);
}

.abh-item:last-child {
    border-bottom: none;
}

/* Table Format */
.abh-table-wrapper {
    padding: 5px;
    overflow-x: auto;
}

/* inline-block lets text-align on the wrapper center/right-align the whole table */
.abh-table {
    display: inline-block;
    width: var(--abh-width, auto);
    margin: 0; /* neutralize theme "table { margin }" rules */
    border-collapse: collapse;
}

.abh-table tr {
    border-bottom: var(--abh-divider, none);
}

.abh-table tr:last-child {
    border-bottom: none;
}

.abh-table td {
    font-size: var(--abh-font-size, 16px);
    background-color: transparent !important;
    border: none;
    text-align: left;
    padding-top: calc(var(--abh-row-spacing, 10px) / 2);
    padding-bottom: calc(var(--abh-row-spacing, 10px) / 2);
}

.abh-day {
    font-weight: var(--abh-day-weight, 600);
    color: var(--abh-day-color, inherit);
    padding: 0 15px 0 0;
}

.abh-time {
    padding: 0;
    color: var(--abh-text-color, inherit);
}

/* Inline Format */
.abh-inline {
    background: var(--abh-bg-color, #ffffff);
    border: 1px solid var(--abh-accent, #e0e0e0);
    border-radius: 6px;
    padding: 15px 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.abh-text {
    font-size: var(--abh-font-size, 14px);
    color: var(--abh-text-color, #555);
    line-height: 1.8;
}

/* Error and No Data Messages */
.abh-error,
.abh-no-data,
.abh-notice {
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-left: 4px solid #ffc107;
    border-radius: 4px;
    padding: 15px 20px;
    margin: 15px 0;
    color: #856404;
    font-size: 14px;
}

.abh-error {
    background: #f8d7da;
    border-color: #dc3545;
    color: #721c24;
}

.abh-no-data {
    background: #e7f3ff;
    border-color: #2271b1;
    color: #004085;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
    .abh-list,
    .abh-table-wrapper,
    .abh-inline {
        padding: 15px;
    }

    /* Optional "Stack on Mobile" layout: each row becomes a card with the
       time below the day. Enabled via the Appearance setting or the
       stack_mobile="yes" shortcode attribute (adds .abh-stack-mobile). */
    .abh-stack-mobile .abh-table,
    .abh-stack-mobile .abh-table tbody,
    .abh-stack-mobile .abh-table tr,
    .abh-stack-mobile .abh-table td {
        display: block;
        width: 100%;
    }

    .abh-stack-mobile .abh-table tr {
        margin-bottom: var(--abh-row-spacing, 10px);
        border: 1px solid var(--abh-accent, rgba(0, 0, 0, 0.12));
        border-radius: 4px;
        padding: 10px;
    }

    .abh-stack-mobile .abh-table tr:last-child {
        margin-bottom: 0;
    }

    .abh-stack-mobile .abh-table td {
        text-align: var(--abh-text-align, left);
        padding: 3px 0;
    }

    .abh-stack-mobile .abh-table .abh-day::after {
        content: ":";
    }
}

/* Print Styles */
@media print {
    .abh-wrapper {
        box-shadow: none;
    }

    .abh-list,
    .abh-table-wrapper,
    .abh-inline {
        border: 1px solid #000;
        box-shadow: none;
    }
}