/* =========================================================================
   assets/decal-cart-compat.css

   Тонкий шар сумісності між СТАРИМ оформленням сторінок наліпок
   (assets/style.css) і НОВИМ кошиком та формою замовлення
   (indexs/cart.css, indexs/order-form.css).

   Навіщо. Сторінки /decal/** зібрані зі старого шаблону, а він задає
   правила прямо на тегах:

       button, .button { background: var(--red); padding: 13px 23px 12px;
                         border-radius: 24px; margin: 20px 5px 0 0;
                         font-size: 17px; font-weight: 700; box-shadow: … }
       img            { box-shadow: 0 4px 8px rgba(0,0,0,.4) }
       p              { padding: 15px 0 5px 0 }

   Сторінки нового шаблону таких правил не мають, тож cart.css і
   order-form.css писалися під чисті теги: вони задають лише те, що їм
   потрібно, а решту лишають на браузер. Без цього файлу всі кнопки
   всередині шторки кошика й форми замовлення отримали б чужий відступ
   20px згори та 5px справа, круглий червоний фон і зайву тінь, а
   мініатюра макета — тінь від фотографій каталогу.

   Як це працює. Селектори навмисно мають ту саму «вагу», що й правила
   на голому тезі (специфічність 0-0-1): :where() не додає ваги, тому

       :where(.razcart-overlay) button        →  0-0-1
       button:where(.razcart-fab)             →  0-0-1

   Такий селектор перемагає `button { … }` зі style.css лише тому, що цей
   файл підключений ПІСЛЯ нього, і водночас програє будь-якому правилу з
   класом (.razcart-checkout-btn — це вже 0-1-0). Тобто скидання діє
   тільки там, де cart.css/order-form.css нічого не сказали, і не заважає
   їм там, де вони висловилися.

   ПОРЯДОК ПІДКЛЮЧЕННЯ (важливо):
       assets/style.css  →  assets/ui.css  →  ЦЕЙ ФАЙЛ
       →  indexs/cart.css  →  indexs/order-form.css
   ========================================================================= */

:where(.razcart-overlay, .razcart-toast, .razof-overlay) button,
button:where(.razcart-fab) {
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-size: inherit;
    font-weight: 400;
    box-shadow: none;
    transition: none;
}

/* Наведення на кнопку теж підсвічувалося тінню зі старого шаблону */
:where(.razcart-overlay, .razcart-toast, .razof-overlay) button:hover,
button:where(.razcart-fab):hover {
    box-shadow: none;
}

/* Мініатюра макета в кошику — не фотографія з каталогу: тінь і
   примусова висота тут лише заважають. */
:where(.razcart-overlay, .razof-overlay) img {
    box-shadow: none;
}

/* Абзаци всередині форми замовлення мають власні відступи */
:where(.razcart-overlay, .razof-overlay) p {
    padding: 0;
}
