/**
 * Eldrotec Product Specs — frontend styles
 * Scoped to .eps-* to avoid theme conflicts
 */

/* ── Functions Overview ──────────────────────────────────────────────────── */
.eps-fn-wrap {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.eps-fn-heading {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    color: #0A1628;
    margin: 0 0 14px;
    line-height: 1.2;
}
.eps-fn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 10px 24px;
    margin-top: 18px;
}
.eps-fn-row {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 6px 0;
}
.eps-fn-icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    color: #0D9488;
    margin-top: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.eps-fn-icon svg,
.eps-fn-icon i {
    width: 100%;
    height: 100%;
    fill: currentColor;
}
.eps-fn-text {
    font-size: 14.5px;
    color: #2D3748;
    line-height: 1.6;
}

/* ── Specs Accordion ─────────────────────────────────────────────────────── */
.eps-sp-wrap {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.eps-sp-heading {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    color: #0A1628;
    margin: 0 0 14px;
    line-height: 1.2;
}
.eps-sp-group {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    margin-bottom: 8px;
    overflow: hidden;
    transition: border-color 0.15s;
}
.eps-sp-group[open] {
    border-color: #CBD5E1;
}
.eps-sp-summary {
    padding: 14px 18px;
    cursor: pointer;
    font-weight: 600;
    font-size: 15px;
    color: #0A1628;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    user-select: none;
}
.eps-sp-summary::-webkit-details-marker { display: none; }
.eps-sp-summary:hover { background: #F8FAFC; }

.eps-sp-summary-left {
    display: flex;
    align-items: center;
    gap: 10px;
}
.eps-sp-icon {
    color: #4D7F7F;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}
.eps-sp-icon svg {
    width: 1em;
    height: 1em;
    display: block;
}
.eps-sp-icon i {
    font-size: inherit;
}
.eps-sp-title {
    font-weight: 600;
    color: #0A1628;
}
.eps-sp-chev {
    font-size: 14px;
    color: #94A3B8;
    transition: transform 0.2s;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.eps-sp-chev i,
.eps-sp-chev svg {
    width: 1em;
    height: 1em;
    line-height: 1;
}
.eps-sp-group[open] .eps-sp-chev {
    transform: rotate(180deg);
}

.eps-sp-content {
    padding: 0 18px 14px;
}
.eps-sp-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    table-layout: fixed;
}
.eps-sp-table tr,
.eps-sp-table tr:nth-child(even),
.eps-sp-table tr:nth-child(odd) {
    background: transparent !important;
}
.eps-sp-table tr td {
    /* padding handled by Elementor control — fallback only */
    padding: 10px 0;
    border-bottom: 1px solid #F1F5F9;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    font-size: 14px;
    line-height: 1.5;
    vertical-align: top !important;
    background: transparent !important;
    color: inherit;
}
.eps-sp-table tr:last-child td {
    border-bottom: none !important;
}
.eps-sp-label {
    color: #64748B;
    width: 50% !important;
    padding-right: 12px !important;
    font-weight: 400;
    background: transparent !important;
}
.eps-sp-value {
    color: #0A1628;
    font-weight: 500;
    text-align: right !important;
    direction: ltr;
    background: transparent !important;
}

/* RTL support — Hebrew site */
[dir="rtl"] .eps-sp-label {
    padding-right: 0;
    padding-left: 12px;
}
[dir="rtl"] .eps-sp-value {
    text-align: left;
}

/* Responsive */
@media (max-width: 600px) {
    .eps-sp-summary { padding: 12px 14px; font-size: 14px; }
    .eps-sp-content { padding: 0 14px 12px; }
    .eps-sp-table tr td { padding: 8px 0; font-size: 13px; }
    .eps-sp-label { width: 55%; }
}

/* ── Hero Key Specs ──────────────────────────────────────────────────────── */
.eps-hs-wrap {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.eps-hs-grid {
    display: grid;
    grid-template-columns: repeat(var(--eps-cols, 2), var(--eps-col-size, 1fr));
    justify-content: flex-start;
    gap: 10px;
}
[dir="rtl"] .eps-hs-grid {
    justify-content: flex-end;
}
.eps-hs-box {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 10px 16px;
    min-width: 0;
}
.eps-hs-value {
    font-size: 17px;
    font-weight: 700;
    color: #0A1628;
    line-height: 1.25;
}
.eps-hs-label {
    font-size: 11px;
    color: #64748B;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 2px;
}

/* Mobile fallback — never less than 2 columns */
@media (max-width: 480px) {
    .eps-hs-value { font-size: 15px; }
    .eps-hs-label { font-size: 10px; }
}

/* ── Empty state (shown only in Elementor editor) ─────────────────────────── */
.eps-hs-empty {
    padding: 20px;
    text-align: center;
    color: #64748B;
    background: #F8FAFC;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    font-size: 13px;
}

/* ── Make sure Font Awesome <i> tags display correctly inside our wrappers ─ */
.eps-fn-icon i,
.eps-sp-icon i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* ── SVG icon support (Phosphor / custom SVGs) ────────────────────────────── */
.eps-fn-icon svg,
.eps-sp-icon svg {
    width: 1em;
    height: 1em;
    display: block;
}

/* Inherit color from parent for monochrome SVGs that use currentColor */
.eps-fn-icon svg [fill="currentColor"],
.eps-sp-icon svg [fill="currentColor"],
.eps-fn-icon svg [stroke="currentColor"],
.eps-sp-icon svg [stroke="currentColor"] {
    fill: currentColor;
    stroke: currentColor;
}