/* ===== Roboto everywhere (English), mobile footer with drop-down menus ===== */
html:not([lang^="ar"]) body.cg {
  --cg-serif: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cg-sans: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --theme-font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
}
html:not([lang^="ar"]) body.cg button, html:not([lang^="ar"]) body.cg input, html:not([lang^="ar"]) body.cg select, html:not([lang^="ar"]) body.cg textarea { font-family: inherit; }
/* The shop name wordmark keeps its own lettering */
html:not([lang^="ar"]) body.cg .cg-logo { font-family: "Playfair Display", Georgia, serif; }

/* Footer: desktop keeps the dark columns; the phone-only parts stay hidden */
.cg-footer__contact, .cg-footer__accept p, .cg-footer__follow { display: none; }
.cg-footer__accept .cg-pays { padding-top: 22px; }
.cg-fcol__head { cursor: default; }
@media (min-width: 901px) {
  .cg-footer__cols { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .cg-fcol__head { font-size: 16px; margin: 0 0 10px; }
}

/* ---- Phone footer ---- */
@media (max-width: 900px) {
  body.cg .cg-footer { background: #f4f4f4; color: #111; margin-top: 36px; padding: 0 0 8px; font-size: 15px; }
  .cg-footer .cg-wrap { padding-inline: 0; }
  .cg-footer__perks, .cg-footer__brand { display: none; }
  .cg-footer__contact { display: block; }
  .cg-fcontact { display: flex; align-items: center; gap: 16px; padding: 18px 16px; border-bottom: 1px solid #e3e3e3; color: #111 !important; text-decoration: none; margin: 0 !important; }
  .cg-fcontact__ic { flex: none; width: 52px; height: 52px; border: 1px solid #d3d3d3; border-radius: 50%; display: flex !important; align-items: center; justify-content: center; margin: 0 !important; color: #111; }
  .cg-fcontact small { display: block; color: #8a93a6; font-size: 14px; margin: 0 0 2px; }
  .cg-fcontact strong { display: block; font-weight: 400; font-size: 17px; line-height: 1.3; color: #111; word-break: break-word; }
  .cg-footer__cols { display: block; padding: 0; }
  .cg-fcol { border-bottom: 1px solid #e3e3e3; }
  body.cg .cg-footer .cg-fcol__head { position: relative; display: block; margin: 0; padding: 20px 48px 20px 16px; font: 700 16px "Roboto", system-ui, sans-serif; color: #111; cursor: pointer; user-select: none; }
  [dir="rtl"] body.cg .cg-footer .cg-fcol__head { padding: 20px 16px 20px 48px; font-family: inherit; }
  .cg-fcol__head::after { content: ""; position: absolute; inset-inline-end: 20px; top: 50%; width: 9px; height: 9px; border: solid #333; border-width: 0 2px 2px 0; transform: translateY(-70%) rotate(45deg); transition: transform .2s; }
  .cg-fcol.is-open .cg-fcol__head::after { transform: translateY(-30%) rotate(-135deg); }
  .cg-footer.is-js .cg-fcol__body { display: none; padding: 0 16px 14px; }
  .cg-footer.is-js .cg-fcol.is-open .cg-fcol__body { display: block; }
  .cg-fcol__body { padding: 0 16px 14px; }
  .cg-footer .cg-fcol__body a { display: block; color: #333 !important; padding: 9px 0; font-size: 15px; margin: 0; }
  .cg-footer__accept { text-align: center; padding: 20px 16px 6px; }
  .cg-footer__accept p { display: block; margin: 0; font-size: 17px; color: #111; }
  .cg-footer__accept .cg-pays { justify-content: center; padding-top: 12px; }
  .cg-footer__follow { display: block; text-align: center; padding: 14px 16px 6px; border-top: 1px solid #e3e3e3; margin-top: 18px; }
  .cg-footer__follow p { margin: 6px 0 12px; font-size: 17px; color: #111; }
  .cg-footer__follow .cg-social { justify-content: center; gap: 14px; margin: 0; }
  .cg-footer__follow .cg-social a { width: 44px; height: 44px; border-radius: 50%; background: #1b1b1b; color: #fff !important; align-items: center; justify-content: center; margin: 0; }
  .cg-footer__follow .cg-social svg { width: 24px; height: 24px; }
  .cg-footer__bar { flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 18px 16px 10px; margin-top: 8px; border-top: 1px solid #e3e3e3; color: #555; }
  .cg-footer__bar span { color: #555; font-size: 13px; }
  .cg-footer__bar .cg-lang { color: #111; border-color: #cfcfcf; }
  .cg-footer__legal { justify-content: center; gap: 4px 16px; }
  body.cg .cg-footer__legal a { color: #555 !important; font-size: 13px; }
  body.cg .cg-footer a:hover { color: #000 !important; }
}

/* Phone footer keeps the brand green (dark ink) with light text */
@media (max-width: 900px) {
  body.cg .cg-footer { background: #1d2b27; color: #e9dcc0; }
  .cg-fcontact { border-bottom-color: rgba(217,204,176,.25); color: #fff !important; }
  .cg-fcontact__ic { border-color: rgba(217,204,176,.45); color: #fff; }
  .cg-fcontact small { color: #b9ad8f; }
  .cg-fcontact strong { color: #fff; }
  .cg-fcol { border-bottom-color: rgba(217,204,176,.25); }
  body.cg .cg-footer .cg-fcol__head { color: #fff; }
  .cg-fcol__head::after { border-color: #e9dcc0; }
  .cg-footer .cg-fcol__body a { color: #d9ccb0 !important; }
  .cg-footer__accept p, .cg-footer__follow p { color: #fff; }
  .cg-footer__follow { border-top-color: rgba(217,204,176,.25); }
  .cg-footer__follow .cg-social a { background: #fff; color: #1d2b27 !important; }
  .cg-footer__bar { border-top-color: rgba(217,204,176,.25); color: #b9ad8f; }
  .cg-footer__bar span { color: #b9ad8f; }
  .cg-footer__bar .cg-lang { color: #fff; border-color: rgba(217,204,176,.45); }
  body.cg .cg-footer__legal a { color: #d9ccb0 !important; }
  body.cg .cg-footer a:hover { color: #fff !important; }
}