/*
Theme Name: MyChooz Aesthetic
Theme URI: https://mychooz.com
Description: Block theme for MyChooz. Clean, fast, beautiful.
Author: MyChooz Team
Author URI: https://mychooz.com
Version: 0.1.220
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
License URI: https://mychooz.com/license
Text Domain: mychooz-aesthetic
*/

/* ==========================================================================
   INTER FONT — self-hosted variable subsets (latin + cyrillic)
   ========================================================================== */

@font-face {
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    src: url('./assets/fonts/inter/inter-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    src: url('./assets/fonts/inter/inter-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    src: url('./assets/fonts/inter/inter-cyrillic-ext.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* ==========================================================================
   CSS VARIABLES (from theme.json)
   ========================================================================== */

:root {
    /* Colors */
    --mca-bg: var(--wp--preset--color--background, #f7f8fa);
    --mca-surface: var(--wp--preset--color--content, #ffffff);
    --mca-text: var(--wp--preset--color--text, #1a1a1a);
    --mca-muted: var(--wp--preset--color--muted, #6b7280);
    --mca-primary: var(--wp--preset--color--primary, #e71d1d);
    --mca-primary-hover: var(--wp--preset--color--primary-hover, #c91818);
    --mca-border: var(--wp--preset--color--border, #e5e7eb);
    --mca-link: #1a0dab;
    --mca-star: #f59e0b;
    --mca-star-empty: #d1d5db;
    --mca-success: #10b981;

    /* Radius */
    --mca-radius: var(--wp--custom--radius--large, 12px);
    --mca-radius-sm: var(--wp--custom--radius--small, 6px);

    /* Layout */
    --mca-content-width: 720px;
    --mca-wide-width: 1200px;
    --mca-gap-header: var(--wp--custom--gap--header-desktop, 32px);

    /* Island padding — единый токен для archive/author/search/404
       (single/home/page имеют свою специфику и не используют) */
    --mca-island-padding: 32px;
    --mca-island-padding-mobile: 24px 16px;

    /* Island gap — вертикальное расстояние между островами
       (родитель раскладывает их через flex column gap) */
    --mca-island-gap: 24px;
    --mca-island-gap-mobile: 16px;

    /* Animation */
    --mca-transition-fast: 0.15s ease;
    --mca-transition-normal: 0.25s ease;
    --mca-transition-slow: 0.35s ease;
    --mca-easing-smooth: cubic-bezier(0.16, 1, 0.3, 1);

    /* Card shadows */
    --mca-card-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);           /* light cards (hp-post) */
    --mca-card-shadow-dark: 0 4px 14px 2px rgba(0, 0, 0, 0.22);   /* dark cards (hp-fc) */
    --mca-card-shadow-hover: 0 4px 20px rgba(0, 0, 0, 0.22);
}

/* ==========================================================================
   BASE
   ========================================================================== */

/* Prevent horizontal scroll on mobile (clip instead of hidden to not break sticky) */
html {
    overflow-x: clip;
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
}

body {
    background-color: var(--mca-bg);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.7;
    color: var(--mca-text);
    overflow-x: clip;
}

/* Focus for keyboard navigation (accessibility) */
:focus-visible {
    outline: 2px solid var(--mca-primary);
    outline-offset: 2px;
}


/* ==========================================================================
   CONTENT SHEET (white card on gray background)
   Utility: добавляй класс .mca-sheet к любому surface-card контейнеру.
   Документация: _dev/AESTHETIC.md → Utilities
   ========================================================================== */

.mca-sheet {
    background-color: var(--mca-surface);
    max-width: var(--mca-content-width);
    width: calc(100% - 48px);
    margin: 24px auto;
    border-radius: var(--mca-radius);
    box-sizing: border-box;
    /* padding задаёт каждая страница (single=20px, 404=60px 20px, page/search=32px, author=32px, intro=32px) */
}

/* Muted text helper (для шаблонов, где inline style был запрещён) */
.mca-muted {
    color: var(--mca-muted);
}

/* Default padding для sheet-страниц общего назначения (page, about, privacy...) */
.page-content {
    padding: 32px;
}
@media (max-width: 768px) {
    .page-content {
        padding: 24px 16px;
    }
}

/* Homepage - no wrapper, islands are separate */
/* override: WP FSE contentSize (720px) from theme.json */
.wp-site-blocks > .homepage,
.home main,
.front-page main {
    background: transparent;
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 0;
    border-radius: 0;
}

/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

h1, .wp-block-post-title {
    margin-bottom: 24px;
    text-align: center;
}

/* ==========================================================================
   MOBILE BASE
   ========================================================================== */

@media (max-width: 768px) {
    .mca-sheet {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        border-radius: 0;
        /* padding mobile задаёт каждая страница */
    }

    /* Обнуляем has-global-padding у main-обёрток, внутри которых .mca-sheet
       должен быть edge-to-edge. WP FSE даёт `.wp-site-blocks > .has-global-padding`
       со специфичностью 0,2,0 — перекрываем через 0,2,1 без !important. */
    .wp-site-blocks main.search-template,
    .wp-site-blocks main.page-template,
    .wp-site-blocks main.has-global-padding:has(> .mca-sheet) {
        padding-left: 0;
        padding-right: 0;
    }

    .home main,
    .front-page main {
        width: 100%;
        margin: 0;
        padding: 0;
        border-radius: 0;
    }
}

/* ==========================================================================
   PAGINATION (universal - works on all pages)
   ========================================================================== */

/* Pagination: Segmented Control (iOS style) */
.wp-block-query-pagination {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding-top: 32px;
}

/* Arrow buttons (prev/next) */
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: var(--mca-surface);
    border-radius: 10px;
    color: var(--mca-text);
    text-decoration: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    transition: all 150ms;
    font-size: 0; /* Hide text */
}

.wp-block-query-pagination-previous::before,
.wp-block-query-pagination-next::after {
    font-size: 18px;
    line-height: 1;
}

.wp-block-query-pagination-previous::before {
    content: "\2190";
}

.wp-block-query-pagination-next::after {
    content: "\2192";
}

.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover {
    background: var(--mca-text);
    color: #fff;
}

.wp-block-query-pagination-previous:focus-visible,
.wp-block-query-pagination-next:focus-visible {
    outline: 2px solid var(--mca-primary);
    outline-offset: 2px;
}

/* Numbers segment */
.wp-block-query-pagination-numbers {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 4px;
    background: var(--mca-border);
    border-radius: 10px;
}

.wp-block-query-pagination-numbers .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 4px;
    font-size: 14px;
    font-weight: 500;
    color: var(--mca-muted);
    text-decoration: none;
    border-radius: 8px;
    transition: all 150ms;
}

.wp-block-query-pagination-numbers .page-numbers:hover {
    color: var(--mca-text);
}

.wp-block-query-pagination-numbers .page-numbers.current {
    background: var(--mca-surface);
    color: var(--mca-text);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.wp-block-query-pagination-numbers .page-numbers.dots {
    min-width: 24px;
    color: var(--mca-muted);
    pointer-events: none;
}

/* ==========================================================================
   BLOCK TEXT NORMALIZATION
   Criterias & Info blocks: match body font (Inter 16px/1.7)
   ========================================================================== */

/* wpDiscuz hidden elements (visible when CSS dequeued on non-singular) */
#wpdUserContentInfo,
#wpd-editor-source-code-wrapper-bg,
#wpd-editor-source-code-wrapper { display: none !important; }

.wp-block-mychooz-criterias p,
.single .wp-block-mychooz-criterias .criterion-description,
.single .wp-block-mychooz-criterias .criterion-name-inline,
.wp-block-mychooz-info p,
.wp-block-mychooz-block-model p {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
}