/* =============================================================================
   complete-cart.css
   Полный набор стилей:
   - Floating Cart Button
   - Toast
   - Cart Drawer
   - Pay Modal (bottom-sheet на мобиле)
   - Глобальные правила скрытия: .mobile-icons.has-one-icon,
     showLoginForm, ajax/mini-cart, ссылки на account/cart, WhatsApp и др.
   Примечание: все правила скрытия используют !important для приоритета.
   ============================================================================= */

/* ===== Floating Cart Button ===== */
.cc-fab {
  position: fixed;
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 2147483000;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 0;
  background: #e4002b;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cc-fab__icon { font-size: 22px; transform: translateY(-1px); }
.cc-fab__badge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 22px;
  height: 22px;
  background: #111;
  color: #fff;
  border-radius: 999px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 700 12px/1 system-ui, Arial;
}
.cc-fab.is-empty .cc-fab__badge { display: none; }

/* ===== Toast ===== */
.cc-toast {
  position: fixed;
  left: 50%;
  bottom: calc(84px + env(safe-area-inset-bottom));
  transform: translateX(-50%) translateY(20px);
  background: rgba(17,17,17,.95);
  color: #fff;
  padding: 10px 14px;
  border-radius: 10px;
  font: 500 14px/1.2 system-ui, Arial;
  z-index: 2147483000;
  opacity: 0;
  pointer-events: none;
  transition: .25s;
}
.cc-toast.is-show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ===== Cart Drawer ===== */
.cc-cart { position: fixed; inset: 0; display: none; z-index: 2147482000; }
.cc-cart.is-open { display: block; }
.cc-cart__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(2px); }
.cc-cart__panel {
  position: absolute; right: 0; top: 0; bottom: 0;
  width: min(420px, 92vw);
  background: #fff;
  box-shadow: -10px 0 40px rgba(0,0,0,.25);
  display: grid; grid-template-rows: auto 1fr auto;
  transform: translateX(100%); transition: transform .24s ease;
}
.cc-cart.is-open .cc-cart__panel { transform: translateX(0); }
.cc-cart__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 14px; border-bottom: 1px solid #eceff3; font: 700 16px/1 system-ui, Arial;
}
.cc-cart__head-actions { display: inline-flex; align-items: center; gap: 8px; }
.cc-cart__close {
  width: 36px; height: 36px; border-radius: 10px; border: 0; background: #f2f3f4; cursor: pointer; font-size: 20px;
}
.cc-link { background: none; border: 0; color: #6b7280; cursor: pointer; font: 600 12px/1 system-ui, Arial; }

.cc-cart__list { overflow: auto; padding: 10px 10px 4px; }
.cc-cart__empty { padding: 24px; color: #6b7280; }

.cc-row {
  display: grid; grid-template-columns: 1fr auto auto; align-items: center;
  gap: 8px; padding: 10px; border: 1px solid #eceff3; border-radius: 12px; margin-bottom: 8px; background: #fff;
}
.cc-row__main { min-width: 0; }
.cc-row__title { font: 700 14px/1.2 system-ui, Arial; word-break: break-word; margin-bottom: 4px; }
.cc-row__meta { font: 600 13px/1.2 system-ui, Arial; color: #111; }

.cc-row__qty { display: inline-flex; align-items: center; gap: 6px; }
.cc-qty__btn {
  width: 28px; height: 28px; border-radius: 8px; border: 1px solid #e5e7eb; background: #f8fafc; cursor: pointer;
  font: 700 16px/1 system-ui, Arial;
}
.cc-qty__input {
  width: 36px; text-align: center; border: 1px solid #e5e7eb; height: 28px; border-radius: 8px; outline: none;
}
.cc-row__del {
  width: 28px; height: 28px; border-radius: 8px; border: 0; background: #f3f4f6; cursor: pointer; font-size: 18px;
}

.cc-cart__foot { border-top: 1px solid #eceff3; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); background: #fff; }
.cc-cart__totals { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; font: 700 16px/1 system-ui, Arial; }
.cc-checkout {
  width: 100%; height: 48px; border-radius: 14px; border: 0; background: #e4002b; color: #fff; font: 800 16px/1 system-ui, Arial; cursor: pointer;
}

/* ===== Pay Modal (bottom-sheet на мобиле) ===== */
.cc-modal { position: fixed; inset: 0; z-index: 2147481000; display: none; }
.cc-modal.is-open { display: block; }
.cc-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(2px); }
.cc-modal__card {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(560px, 92vw); max-height: calc(100dvh - 48px); overflow: auto;
  background: #fff; border-radius: 18px; padding: 22px 22px calc(22px + env(safe-area-inset-bottom));
  box-shadow: 0 30px 80px rgba(0,0,0,.25);
}
.cc-modal__close { position: absolute; right: 12px; top: 10px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: #f2f3f4; font-size: 22px; cursor: pointer; }
.cc-modal__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.cc-modal__title { margin: 0; font: 800 20px/1.2 system-ui, Arial; }
.cc-modal__price { font: 800 18px/1.2 system-ui, Arial; color: #e4002b; }

.cc-form { display: grid; gap: 12px; }
.cc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cc-field { display: grid; gap: 6px; }
.cc-field > span { font: 600 12px/1 system-ui, Arial; color: #5b6670; }
.cc-field > input { height: 48px; border-radius: 12px; border: 1px solid #e1e5ea; padding: 0 12px; font: 16px/1 system-ui, Arial; outline: none; background: #fff; }
.cc-field > input:focus { border-color: #e4002b; box-shadow: 0 0 0 3px rgba(228,0,43,.12); }
.cc-submit { position: sticky; bottom: calc(env(safe-area-inset-bottom)); height: 50px; border-radius: 14px; border: 0; cursor: pointer; background: #e4002b; color: #fff; font: 800 16px/1 system-ui, Arial; }

@media (max-width: 640px){
  .cc-modal__card {
    left: 0; right: 0; top: auto; bottom: 0; transform: none; width: 100vw;
    max-height: calc(var(--cc-vh, 1vh) * 100 - 10px);
    border-radius: 20px 20px 0 0; padding: 16px 14px calc(16px + env(safe-area-inset-bottom));
    box-shadow: 0 -8px 40px rgba(0,0,0,.35);
  }
  .cc-modal__head { position: sticky; top: 0; background: #fff; border-bottom: 1px solid #f1f2f4; padding-bottom: 8px; margin-bottom: 8px; z-index: 1; }
  .cc-submit { height: 52px; font-size: 17px; border-radius: 12px; }
}

/* ===== Hide login/phone blocks (дублируем и на CSS уровне) ===== */
li.nav-item.orderNow,
ul.sidebar-nav.not-logged .phone-item,
ul.sidebar-nav.not-logged .divider-bottom,
a[href="#loginModal"],
[data-target="#loginModal"] {
  display: none !important;
}

/* =============================================================================
   ГЛОБАЛЬНОЕ СКРЫТИЕ: полностью скрыть .mobile-icons.has-one-icon,
   ссылку showLoginForm, мини-корзину, avatar и WhatsApp — на всех устройствах
   (включая ПК)
   ============================================================================= */

/* 1) Скрыть блок с мобильными иконками полностью (включая вложенные элементы) */
.mobile-icons.has-one-icon,
.mobile-icons.has-one-icon * {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 2) Резервные селекторы для ajax/mini-cart и связанных элементов */
#theme-ajax-cart,
.theme-ajax-cart,
.ajax-cart,
.ajax-cart--mini-cart,
.ajax-cart__content,
.ajax-cart__empty-cart-message,
.ajax-cart__form,
.ajax-cart__button-wrapper,
.ajax-cart__close-icon,
.ajax-cart__list,
.ajax-cart__details-wrapper,
.ajax-cart__subtotal,
.ajax-cart__button-wrapper,
.header-cart,
.header-cart.action-area__link,
.header-cart .header__link,
.header-cart .header-cart__icon,
.header-cart .header-cart__count,
.header-cart .header-cart__caption,
.header-cart__icon,
.header-cart__count--badge,
.theme-ajax-cart.shopify-section,
.theme-ajax-cart.jsAjaxCart,
.theme-ajax-cart--header-search_focus,
#ajax-cart__content,
#theme-ajax-cart .ajax-cart__empty-cart-message {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 3) Скрыть элементы с классом showLoginForm (ссылки/контейнеры), их svg/avatar и подписи */
.header__link.action-area__link.showLoginForm,
a.showLoginForm,
.showLoginForm,
.action-area__link.showLoginForm,
.action-area__link.showLoginForm * {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 4) Селекторы по onclick (если элемент добавлен инлайн-скриптом) */
*[onclick*="showLoginForm"],
a[onclick*="showLoginForm"],
button[onclick*="showLoginForm"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 5) Скрыть явные ссылки на аккаунт/корзину (доп. страховка) */
a.header__link[href*="account"],
a.header__link[href*="account.flowers.ae"],
a.header__link[href*="/cart"],
a.header__link[href*="cart"],
a[href*="account.flowers.ae"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 6) Скрыть иконку-аватар и её подпись */
.icon.header__icon[data-icon="avatar"],
.icon[data-icon="avatar"],
.icon[data-icon="avatar"] svg,
.icon-caption {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 7) Скрыть отдельно вставленный WhatsApp SVG / иконки */
.whatsapp-ico,
svg.whatsapp-ico,
.icon.whatsapp-ico,
.icon.whatsapp-ico * {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 8) Скрыть кнопки/ссылки типа "Login" или "Go to cart" внутри action-area__link */
.action-area__link .icon-caption,
.action-area__link .header-cart__caption,
.action-area__link .header-cart__count,
.action-area__link .header-cart__icon,
.action-area__link .header__link {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 9) Ещё дополнительные селекторы-резерв (если тема использует другие названия) */
[class*="mini-cart"],
[class*="miniCart"],
[class*="ajaxCart"],
[class*="ajax-cart"],
[class*="header-cart"],
[class*="login"],
[class*="signin"],
[class*="account-link"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 10) Если скрипт динамически добавляет элементы внутри header, скрывать их (reserve) */
header [class*="cart"],
header [class*="account"],
header [class*="login"],
header [class*="avatar"],
header a[href*="/cart"],
header a[href*="account"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* =============================================================================
   Пояснения:
   - Это "жёсткий" набор правил: использованы универсальные селекторы и !important,
     чтобы перекрыть большинство тем и inline-стилей.
   - Если после добавления CSS что-то всё ещё видно — тема может вставлять элементы
     через JS с уникальными классами/ID. В этом случае пришлите HTML-фрагменты
     этих элементов (или URL страницы) — быстро добавлю дополнительные селекторы.
   - Если хотите скрывать ТОЛЬКО на десктопе или ТОЛЬКО на мобильных, скажите —
     пришлю вариант с соответствующими @media (min-width / max-width).
   ============================================================================= */
