/**
 * Choobsa Design System Foundation
 * Version 0.3.3
 */

:root {
    /* Layout */
    --choobsa-content-width: 1240px;
    --choobsa-narrow-width: 840px;
    --choobsa-gutter: clamp(16px, 3vw, 32px);

    /* Typography */
    --choobsa-font-primary: "IRANSansXFaNum", Tahoma, Arial, sans-serif;
    --choobsa-font-weight-regular: 400;
    --choobsa-font-weight-medium: 500;
    --choobsa-font-weight-semibold: 600;
    --choobsa-font-weight-bold: 700;

    /* Neutral palette */
    --choobsa-color-text: #2d2d32;
    --choobsa-color-muted: #676783;
    --choobsa-color-surface: #ffffff;
    --choobsa-color-soft: #f7f7fb;
    --choobsa-color-soft-warm: #f7f6f2;
    --choobsa-color-border: rgba(45, 45, 50, 0.14);

    /* Brand palette extracted from the live-site button */
    --choobsa-color-brand-light: #e9d1af;
    --choobsa-color-brand-mid: #d4aa78;
    --choobsa-color-brand-dark: #b88756;
    --choobsa-color-brand-ink: #2e1b0f;
    --choobsa-color-on-brand: #fffdf8;

    --choobsa-gradient-primary: linear-gradient(
        -135deg,
        var(--choobsa-color-brand-light) 0%,
        var(--choobsa-color-brand-mid) 55%,
        var(--choobsa-color-brand-dark) 100%
    );

    /* Shape and motion */
    --choobsa-radius-button: 7px;
    --choobsa-radius-card: 12px;
    --choobsa-shadow-button: 0 6px 18px rgba(46, 27, 15, 0.12);
    --choobsa-shadow-button-hover: 0 9px 24px rgba(46, 27, 15, 0.22);
    --choobsa-transition-fast: 180ms ease;

    /* Backward-compatible aliases used by the foundation theme */
    --choobsa-text: var(--choobsa-color-text);
    --choobsa-muted: var(--choobsa-color-muted);
    --choobsa-border: var(--choobsa-color-border);
    --choobsa-surface: var(--choobsa-color-surface);
    --choobsa-soft: var(--choobsa-color-soft-warm);
    --choobsa-radius: var(--choobsa-radius-card);
}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--choobsa-font-primary);
}

body {
    color: var(--choobsa-color-text);
    font-weight: var(--choobsa-font-weight-regular);
}

button,
input,
select,
textarea {
    font: inherit;
}

/* Primary brand button for native Choobsa components and WordPress blocks. */
.choobsa-button,
.choobsa-button--primary,
.wp-element-button,
.wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 17px 30px;
    border: 0;
    border-radius: var(--choobsa-radius-button);
    background: var(--choobsa-gradient-primary);
    color: var(--choobsa-color-on-brand);
    font-family: var(--choobsa-font-primary);
    font-size: 1rem;
    font-weight: var(--choobsa-font-weight-medium);
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: var(--choobsa-shadow-button);
    cursor: pointer;
    transition:
        transform var(--choobsa-transition-fast),
        box-shadow var(--choobsa-transition-fast),
        filter var(--choobsa-transition-fast);
}

.choobsa-button:hover,
.choobsa-button--primary:hover,
.wp-element-button:hover,
.wp-block-button__link:hover {
    color: #ffffff;
    filter: brightness(0.92) saturate(1.05);
    box-shadow: var(--choobsa-shadow-button-hover);
    transform: translateY(-2px);
}

.choobsa-button:active,
.choobsa-button--primary:active,
.wp-element-button:active,
.wp-block-button__link:active {
    filter: brightness(0.88);
    box-shadow: 0 4px 12px rgba(46, 27, 15, 0.18);
    transform: translateY(0);
}

.choobsa-button:focus-visible,
.choobsa-button--primary:focus-visible,
.wp-element-button:focus-visible,
.wp-block-button__link:focus-visible {
    outline: 3px solid rgba(212, 170, 120, 0.5);
    outline-offset: 3px;
}

.choobsa-button[disabled],
.choobsa-button--primary[disabled],
.choobsa-button[aria-disabled="true"],
.choobsa-button--primary[aria-disabled="true"] {
    opacity: 0.58;
    cursor: not-allowed;
    filter: grayscale(0.15);
    box-shadow: none;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .choobsa-button,
    .choobsa-button--primary,
    .wp-element-button,
    .wp-block-button__link {
        transition: none;
    }
}