/* miyra-reklamace — frontend styles.
   Everything namespaced under .miyrar_ so theme rules don't leak in.
   `text-transform: none` is set on labels/titles defensively because many
   WP themes uppercase h3 by default. */

.miyrar_wrap {
    --miyrar-radius: 10px;
    --miyrar-border: #e5e7eb;
    --miyrar-muted: #6b7280;
    --miyrar-soft: #f9fafb;
    --miyrar-customer-bg: #eff6ff;
    --miyrar-customer-bd: #bfdbfe;
    --miyrar-shop-bg: #f0fdf4;
    --miyrar-shop-bd: #bbf7d0;
    --miyrar-primary: #2563eb;
    --miyrar-primary-hover: #1d4ed8;
    --miyrar-primary-fg: #fff;

    max-width: 920px;
    margin: 0 auto;
    padding: 1.2em 0 2.4em 0;
    color: #1f2937;
}

.miyrar_wrap *,
.miyrar_wrap *::before,
.miyrar_wrap *::after { box-sizing: border-box; }

.miyrar_wrap h1,
.miyrar_wrap h2,
.miyrar_wrap h3,
.miyrar_wrap h4,
.miyrar_wrap .miyrar_title,
.miyrar_wrap label { text-transform: none; letter-spacing: 0; }

.miyrar_page_title { margin: 0 0 1em 0; font-size: 1.6em; line-height: 1.25; }
.miyrar_title      { margin: 1.6em 0 .6em 0; font-size: 1.1em; font-weight: 600; }

/* ---------- Header strip on detail / list / search ---------- */
.miyrar_detail_head,
.miyrar_facts {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .8em;
    padding: 1em 1.2em;
    background: var(--miyrar-soft);
    border: 1px solid var(--miyrar-border);
    border-radius: var(--miyrar-radius);
    margin-bottom: 1.2em;
}
.miyrar_detail_head strong,
.miyrar_facts strong       { font-size: 1.05em; }
.miyrar_detail_head .miyrar_order_ref,
.miyrar_facts .miyrar_order_ref { color: var(--miyrar-muted); }

.miyrar_state {
    display: inline-block;
    padding: .25em .75em;
    border-radius: 999px;
    color: #fff;
    font-size: .82em;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}

/* ---------- Cards (used for description / chat block) ---------- */
.miyrar_card,
.miyrar_desc_customer,
.miyrar_desc_eshop,
.miyrar_chat {
    background: #fff;
    border: 1px solid var(--miyrar-border);
    border-radius: var(--miyrar-radius);
    padding: 1em 1.2em;
    margin-bottom: 1.2em;
}
.miyrar_desc_customer p,
.miyrar_desc_eshop p   { margin: 0; }

/* ---------- Chat ---------- */
.miyrar_chat {
    padding: 1em;
    display: flex;
    flex-direction: column;
    gap: .7em;
}
.miyrar_msg {
    max-width: 80%;
    padding: .7em .9em;
    border-radius: 12px;
    border: 1px solid transparent;
    position: relative;
}
.miyrar_msg_body  { line-height: 1.4; }
.miyrar_msg_body p { margin: 0 0 .4em 0; }
.miyrar_msg_body p:last-child { margin: 0; }
.miyrar_msg_meta {
    margin-top: .4em;
    font-size: .78em;
    color: var(--miyrar-muted);
}
.miyrar_msg_customer {
    background: var(--miyrar-customer-bg);
    border-color: var(--miyrar-customer-bd);
    align-self: flex-end;
    border-bottom-right-radius: 4px;
}
.miyrar_msg_shop {
    background: var(--miyrar-shop-bg);
    border-color: var(--miyrar-shop-bd);
    align-self: flex-start;
    border-bottom-left-radius: 4px;
}
.miyrar_chat .miyrar_empty {
    color: var(--miyrar-muted);
    font-style: italic;
    margin: 0;
    align-self: center;
}

/* ---------- Forms ---------- */
.miyrar_form {
    background: #fff;
    border: 1px solid var(--miyrar-border);
    border-radius: var(--miyrar-radius);
    padding: 1.2em;
}
.miyrar_form .form-row { margin: 0 0 1em 0; }
.miyrar_form label     { display: block; font-weight: 500; margin-bottom: .35em; }
.miyrar_form input[type="text"],
.miyrar_form input[type="email"],
.miyrar_form input[type="number"],
.miyrar_form input[type="file"],
.miyrar_form select,
.miyrar_form textarea {
    width: 100%;
    padding: .55em .7em;
    font: inherit;
    color: inherit;
    background: #fff;
    border: 1px solid var(--miyrar-border);
    border-radius: 8px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.miyrar_form input:focus,
.miyrar_form select:focus,
.miyrar_form textarea:focus {
    outline: 0;
    border-color: var(--miyrar-primary);
    /* color-mix lets us derive a soft focus halo from --miyrar-primary without
       JS. Falls back gracefully in browsers older than Safari 16.4 by
       dropping the box-shadow entirely. */
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--miyrar-primary) 22%, transparent);
}
.miyrar_form textarea { resize: vertical; min-height: 90px; }

/* Submit buttons. We avoid the WC `.button` namespace entirely because some
   themes/plugins JS-rewrite labels on every `<button>` they find on the
   frontend (Add to Cart). The text now lives inside an inner `<span>` and
   the class is our own — themes don't know `.miyrar_action`. */
.miyrar_wrap .button,
.miyrar_wrap .miyrar_action,
.miyrar_wrap input[type="submit"].miyrar_action,
.miyrar_form button[type="submit"],
.miyrar_form input[type="submit"] {
    background: var(--miyrar-primary) !important;
    color: var(--miyrar-primary-fg);
    border: 0;
    padding: .65em 1.2em;
    font: inherit;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: background .15s ease, transform .05s ease;
    text-decoration: none;
    display: inline-block;
    -webkit-appearance: none;
    appearance: none;
}
.miyrar_wrap .miyrar_action .miyrar_action_label { color: inherit; pointer-events: none; }

/* Avada (and a few other themes) inject a phantom "Add to Cart" submit into
   every form they find on the frontend. Hide any submit-ish element inside
   our forms that isn't one of ours. JS in frontend.js removes them too —
   CSS is the belt, JS is the suspenders. */
.miyrar_form input[type="submit"]:not(.miyrar_action),
.miyrar_form button[type="submit"]:not(.miyrar_action),
.miyrar_form .single_add_to_cart_button,
.miyrar_form .added_to_cart {
    display: none !important;
}

/* Nuke Revolution Slider / Avada Fusion Slider blocks that leak into our
   pages. body.miyrar-page is only present on ?miyrar_* routes (see
   Frontend::stripHomeBodyClasses). Belt to the PHP suspenders in
   Frontend::stripSliderActions() / earlyStripSliderMeta(). */
body.miyrar-page .rev_slider_wrapper,
body.miyrar-page .rev_slider,
body.miyrar-page .tp-banner,
body.miyrar-page .forcefullwidth_wrapper_tp_banner,
body.miyrar-page .fusion-slider-container,
body.miyrar-page .fusion-slider-wrapper,
body.miyrar-page .fusion-page-title-bar-slider {
    display: none !important;
}

/* Hide Avada's page title bar entirely on our routes. It has its own title
   pipeline that ignores WP filters and defaults to the resolved fallback
   post's title (typically the privacy policy). Our templates already show
   their own <h1 class="miyrar_page_title">. */
body.miyrar-page .fusion-page-title-bar,
body.miyrar-page .fusion-page-title-row,
body.miyrar-page .fusion-page-title-wrapper,
body.miyrar-page .avada-page-titlebar-wrapper {
    display: none !important;
}

/* The title bar used to reserve vertical space under Avada's sticky header.
   With it removed, our content slides under the header — put the space back
   on the main content wrapper. 150px covers Avada sticky header + logo
   + a bit of breathing room. */
body.miyrar-page #main,
body.miyrar-page .fusion-tb-content > #content,
body.miyrar-page #content {
    padding-top: 150px !important;
}
.miyrar_wrap .button:hover,
.miyrar_wrap .miyrar_action:hover,
.miyrar_form button[type="submit"]:hover,
.miyrar_form input[type="submit"]:hover { background: var(--miyrar-primary-hover); }
.miyrar_wrap .button:active,
.miyrar_wrap .miyrar_action:active,
.miyrar_form button[type="submit"]:active,
.miyrar_form input[type="submit"]:active { transform: translateY(1px); }

/* Secondary button (used for back-to-shop / general actions) */
.miyrar_wrap .button.miyrar_secondary,
.miyrar_wrap .miyrar_btn_secondary {
    background: #fff;
    color: #111827;
    border: 1px solid var(--miyrar-border);
}
.miyrar_wrap .button.miyrar_secondary:hover {
    background: var(--miyrar-soft);
}

/* Inline form row (search) — keeps a compact two-column on wider screens */
.miyrar_form_search .form-row { display: grid; gap: .35em; }
@media (min-width: 720px) {
    .miyrar_form_search .form-row { grid-template-columns: 180px 1fr; align-items: center; }
    .miyrar_form_search label     { margin: 0; }
}

/* ---------- Tables (claim list / order list) ---------- */
.miyrar_table {
    width: 100%;
    background: #fff;
    border: 1px solid var(--miyrar-border);
    border-radius: var(--miyrar-radius);
    border-spacing: 0;
    border-collapse: separate;
    overflow: hidden;
}
.miyrar_table thead th {
    background: var(--miyrar-soft);
    font-weight: 600;
    text-align: left;
}
.miyrar_table th,
.miyrar_table td {
    padding: .8em 1em;
    border-bottom: 1px solid var(--miyrar-border);
    vertical-align: middle;
}
/* Force a consistent horizontal padding on the outer cells — WooCommerce's
   .shop_table sets `:first-child { padding-left: 0 }` with higher specificity,
   so we explicitly override the outer cells. Safe even when shop_table is
   not present (idempotent). */
.miyrar_table th:first-child,
.miyrar_table td:first-child { padding-left: 1.2em; }
.miyrar_table th:last-child,
.miyrar_table td:last-child  { padding-right: 1.2em; }
.miyrar_table tbody tr:last-child td { border-bottom: 0; }
.miyrar_table tbody tr:hover         { background: var(--miyrar-soft); }
.miyrar_cell_action                  { text-align: right; }

/* ---------- Notices ---------- */
.miyrar_error,
.miyrar_success {
    padding: .9em 1.1em;
    border-radius: var(--miyrar-radius);
    border: 1px solid transparent;
    margin: 0 0 1em 0;
}
.miyrar_error   { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.miyrar_success { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.miyrar_empty   { color: var(--miyrar-muted); font-style: italic; }

/* ---------- Action bar above tables (My Account list) ---------- */
.miyrar_actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: .8em;
}

/* ---------- Theme compatibility ----------
   Some themes (Avada + WooCommerce) set .form-row to display:grid, which
   shrinks the search inputs to ~180px. Force a normal block layout. */
.miyrar_wrap .miyrar_form .form-row { display: block; }
.miyrar_wrap .miyrar_form label > input,
.miyrar_wrap .miyrar_form label > select,
.miyrar_wrap .miyrar_form label > textarea { display: block; margin-top: .35em; }
/* Divider under the search box doubled the box border - keep only the spacing. */
.miyrar_wrap > hr { border: 0; height: 0; margin: 1.25em 0; background: none; }
/* Some themes center content on mobile (often with !important on every p)
   - keep the module left-aligned. */
.miyrar_wrap { text-align: left; }
.miyrar_wrap p,
.miyrar_wrap label,
.miyrar_wrap .form-row { text-align: left !important; }

/* ---------- General-request box ("Nemáte objednávku…") ----------
   The last <p> after the divider on list/search pages - render it as a soft
   card like the forms, sentence on top and the button centred below it. */
.miyrar_wrap > hr + p {
    margin: 0;
    padding: 1.4em 1.5em;
    background: #fff;
    border: 1px solid var(--miyrar-border);
    border-radius: var(--miyrar-radius);
    text-align: center !important;
}
.miyrar_wrap > hr + p .button {
    display: table;
    margin: .9em auto 0;
}

/* Equal spacing above and below the module (was 1.2em top / 2.4em bottom). */
.miyrar_wrap { padding-top: 2.4em; padding-bottom: 2.4em; }