/* White surfaces and the homepage's shared type scale. */
:root {
  --dgp-site-paper: #fff;
  --dgp-site-ink: #202020;
  --dgp-site-accent: #293992;
  --dgp-site-line: #e5e0d8;
  --dgp-text-body: 16px;
  --dgp-text-product: 20px;
  --dgp-text-category: 15px;
  --dgp-text-section: clamp(28px, 2.5vw, 36px);
}
html, body, body #wrapper, body #main, body #footer,
body .absolute-footer { background-color: var(--dgp-site-paper) !important; }
body { font-size: var(--dgp-text-body) !important; }
body #main { font-size: var(--dgp-text-body); color: var(--dgp-site-ink); }

/* Retain photographs and their overlays while replacing solid page surfaces. */
body #main section:not(:where(.banner *, .dgp-home-slider *, .dgp-hero *,
  .dgp-shop-slider *, .ab-hero *, .dgp-design__hero *, .dgp-contact-hero *, .dgp-about-hero *)),
body #main :is(.section-bg, .page-wrapper, .content-area, .elementor,
  .dgp-shop-sidebar__help, .dgp-shop-trust__partners,
  .dgp-news__feature-copy, .dgp-news__topics, .dgp-news__empty,
  .dgp-article__body blockquote, .dgp-article__body th,
  .dgp-design__service, .dgp-design__quote, .dgp-design__form,
  .dgp-about-icon-card, .dgp-about-value-card, .dgp-about-cap-card,
  .dgp-about-proof-card, .dgp-about-form-card,
  .dgp-v2-card, .dgp-v2-map-card, .dgp-v2-channel,
  .dgp-v2-fb-card,
  .dgp-special__card, .dgp-special__details,
  .dgp-special__nav, .dgp-about-nav, .story-chapters) { background-color: #fff !important; }

body #main .dgp-special__nav a:is(:hover, [aria-current]),
body #main .dgp-about-nav .elementor-button:hover {
  background: #fff !important;
  color: var(--dgp-site-accent) !important;
}

body #main :is(.dgp-home-service, .dgp-home-visit, .dgp-home-quality,
  .dgp-design__difference, .dgp-design__cta, .dgp-about-vision,
  .dgp-about-quality, .story-quality, .story-vision,
  .dgp-special__section--cao-cap) :is(h1, h2, h3, h4, p, li, small, strong, span) {
  color: var(--dgp-site-ink) !important;
}
body #main :is(.dgp-home-service, .dgp-home-visit, .dgp-home-quality,
  .dgp-design__difference, .dgp-design__cta, .dgp-about-vision,
  .dgp-about-quality, .story-quality, .story-vision,
  .dgp-special__section--cao-cap) :is(h2, h3, a:not(.button):not(.dgp-btn):not(.dgp-design__button)) {
  color: var(--dgp-site-accent) !important;
}

body #main h2:not(:where(.banner *, .dgp-home-slider *, .dgp-hero *,
  .dgp-shop-slider *, .ab-hero *, .dgp-design__hero *, .dgp-contact-hero *)) {
  font-size: var(--dgp-text-section) !important;
  line-height: 1.25;
}
body #main h3:not(:where(.banner *, .dgp-home-slider *, .dgp-hero *,
  .dgp-shop-slider *, .ab-hero *, .dgp-design__hero *, .dgp-contact-hero *)) {
  font-size: 22px !important;
  line-height: 1.35;
}
body #main .dgp-shop-sidebar__section h2 { font-size: 14px !important; }
body #main .dgp-shop-category-list__link {
  font-size: var(--dgp-text-category) !important;
  font-weight: 500 !important;
  font-style: normal;
  color: var(--dgp-site-ink);
  background: #fff;
  transition: color 180ms ease;
}
body #main .dgp-shop-category-list__link:is(:hover, :focus-visible, .is-active),
body #main .dgp-shop-category-rail__all:is(:hover, :focus-visible) {
  color: var(--dgp-site-accent) !important;
  background: #f3ece3 !important;
}
body #main .dgp-shop-category-rail__item:focus-visible {
  color: #293992 !important;
  background: #f3ece3 !important;
}
body #main .dgp-shop-category-rail__item.is-active:not(:hover) {
  color: #293992 !important;
  background: #eee !important;
}
@media (min-width: 850px) {
  body #main .dgp-shop-category-rail__item:focus-visible,
  body #main .dgp-shop-category-rail__all:is(:hover, :focus-visible) {
    color: #293992 !important;
    background: #eee !important;
  }
}
body #main :is(.dgp-shop-category-rail__all, .dgp-shop-category-rail__item) {
  font-family: "Be Vietnam Pro", Arial, sans-serif !important;
}
body #main .dgp-shop-category-rail__all { font-size: 15px !important; }
body #main .dgp-shop-category-rail__item { font-size: 16px !important; }

/* Keep each hovered desktop category as one continuous navy surface. */
@media (min-width: 850px) and (hover: hover) and (pointer: fine) {
  body #main .dgp-shop-category-rail__all {
    background: #fff !important;
  }

  body #main .dgp-shop-category-rail__all:is(:hover, :focus-visible) {
    background: #293992 !important;
    color: #fff !important;
  }

  body #main .dgp-shop-category-rail__group {
    display: flex;
    align-self: stretch;
  }

  body #main .dgp-shop-category-rail__group .dgp-shop-category-rail__item:not(.is-active) {
    background: #fff !important;
  }

  body #main .dgp-shop-category-rail__group:hover,
  body #main .dgp-shop-category-rail__group:hover .dgp-shop-category-rail__item {
    background: #293992 !important;
  }

  body #main .dgp-shop-category-rail__group .dgp-shop-category-rail__item {
    flex: 1 0 auto;
  }

  body #main .dgp-shop-category-rail .dgp-shop-category-rail__group:hover > .dgp-shop-category-rail__item,
  body #main .dgp-shop-category-rail .dgp-shop-category-rail__item:hover {
    color: #fff !important;
    background: #293992 !important;
  }

  body #main .dgp-shop-category-rail .dgp-shop-category-rail__group:hover > .dgp-shop-category-rail__item *,
  body #main .dgp-shop-category-rail__all:is(:hover, :focus-visible),
  body #main .dgp-shop-category-rail .dgp-shop-category-rail__item:hover * {
    color: #fff !important;
  }
}
body #main :is(.dgp-shop-price-filter label, .dgp-shop-price-filter input,
  .dgp-shop-price-filter button, .dgp-shop-sidebar__help a) { font-size: 13px !important; }
body #main .dgp-shop-sidebar__help strong { font-size: 21px !important; }
body #main .dgp-shop-sidebar__help p { font-size: 14px !important; }
body #main :is(.dgp-shop-toolbar .woocommerce-result-count,
  .dgp-shop-toolbar .woocommerce-ordering select) { font-size: 14px !important; }
body #main .dgp-shop-trust__benefit h3, body #main .dgp-shop-guide h3 { font-size: 18px !important; }
body #main .dgp-shop-trust__benefit p { font-size: var(--dgp-text-body) !important; }
body #main .dgp-shop-featured-category__name { font-size: 16px !important; }
body #main .dgp-shop-shelf__view-all { font-size: 18px !important; }
body #main .dgp-product-card .name,
body #main .dgp-product-card .price ins .amount { font-size: var(--dgp-text-product) !important; }
body #main .dgp-product-card .price del .amount { font-size: 16px !important; }
body #main .dgp-product-card .dgp-product-card__zalo { font-size: 17px !important; }

body #footer .dgp-site-footer { --dgp-footer-line: var(--dgp-site-line); }
body #footer .dgp-site-footer__main { background: var(--dgp-site-accent); color: #f6f6f4; }
body #footer .dgp-site-footer__bottom { background: #1e2a6e; color: #f6f6f4; }
body #footer .dgp-site-footer__consult-form { background: transparent; color: var(--dgp-site-ink); }
body #footer .dgp-site-footer__consult-form > .col-inner { background-color: transparent !important; }
body #footer :is(.dgp-site-footer__main, .dgp-site-footer__bottom) :is(h2, p, a, address) { color: #f6f6f4; }
body #footer :is(.dgp-site-footer__main, .dgp-site-footer__bottom) :is(h2, a:hover, a:focus-visible) { color: #fff; }
body #footer .dgp-site-footer__logo-image,
body #footer .dgp-site-footer__social img { filter: grayscale(1) brightness(0) invert(1); }
body #footer .dgp-site-footer__social a { border-color: rgba(255, 255, 255, .72); }
body #footer .dgp-site-footer__social a:hover { background: rgba(255, 255, 255, .12); border-color: #fff; }

.dgp-recently-viewed {
  max-width: 1300px;
  margin: 48px auto 0;
  padding: 36px 36px 48px;
  border-top: 1px solid var(--dgp-site-line);
  background: #fff;
  color: var(--dgp-site-ink);
  scroll-margin-top: 160px;
}
.dgp-recently-viewed__header { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.dgp-recently-viewed__header h2 { margin: 0; color: var(--dgp-site-accent); }
body #main .dgp-recently-viewed__header h2,
body.single-product #main .product-section-title-related {
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.3;
  text-transform: none !important;
}

body.single-product #main .product-section-title-related,
body.home #main .dgp-shop-shelf--new .dgp-shop-shelf__header h2 {
  color: #293992 !important;
}
body #main .dgp-recently-viewed__clear {
  flex: 0 0 auto;
  width: auto;
  white-space: nowrap;
}
/* Keep the header Zalo contact free of link underlines in every state. */
#header a[href*="zalo.me"],
#header a[href*="zalo.me"] * {
  text-decoration: none !important;
}

.dgp-recently-viewed__clear {
  min-height: 44px;
  padding: 8px 0;
  margin: 0;
  border: 0;
  background: #fff;
  color: var(--dgp-site-accent);
  font: inherit;
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}
.dgp-recently-viewed__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 24px; }
.dgp-recently-viewed__grid .dgp-product-card-component { min-width: 0; max-width: none; margin: 0; }
.dgp-recently-viewed__grid .dgp-product-card-component > .products { display: block; margin: 0; padding: 0; width: 100%; max-width: none; }
.dgp-recently-viewed__grid .dgp-product-card-component .product-small.col { width: 100%; max-width: 100%; flex-basis: 100%; padding: 0; }
body #main .dgp-recently-viewed__grid .dgp-product-card .name { white-space: normal; -webkit-line-clamp: 2; min-height: 2.6em; }
.dgp-recently-viewed__empty { margin: 0; font-size: 16px; line-height: 1.6; color: #56514c; }
.dgp-recently-viewed [hidden] { display: none !important; }
.dgp-recently-viewed :focus-visible { outline: 2px solid var(--dgp-site-accent); outline-offset: 4px; }
body #main #dgp-shop-products:focus { outline: none; }

@media (max-width: 1100px) {
  .dgp-recently-viewed__grid {
    grid-auto-columns: minmax(220px, 30vw);
    grid-auto-flow: column;
    grid-template-columns: none;
    overflow-x: auto;
    padding-bottom: 12px;
    scroll-snap-type: x proximity;
  }
  .dgp-recently-viewed__grid .dgp-product-card-component { scroll-snap-align: start; }
}

@media (max-width: 600px) {
  body #main .dgp-shop-category-rail__all { font-size: 14px !important; }
  body #main .dgp-shop-category-rail__item { font-size: 15px !important; }
  body #main .dgp-shop-featured-category__name { font-size: 14px !important; }
  .dgp-recently-viewed { margin-top: 32px; padding: 28px 20px 36px; scroll-margin-top: 130px; }
  .dgp-recently-viewed__header { align-items: flex-start; gap: 12px; }
  .dgp-recently-viewed__header h2 { max-width: 12ch; }
  .dgp-recently-viewed__clear { flex: 0 0 auto; }
  .dgp-recently-viewed__grid { gap: 14px; }
}

/* Use the shared product cards in two complete columns on mobile. */
@media (max-width: 767px) {
  body #main .dgp-recently-viewed__header {
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
  }
  body #main .dgp-recently-viewed__header h2,
  body.single-product #main .product-section-title-related {
    width: auto;
    max-width: none;
    font-size: clamp(16px, 4.4vw, 20px) !important;
    line-height: 1.3;
    letter-spacing: -.025em;
    white-space: nowrap;
  }
  body #main .dgp-recently-viewed__clear {
    flex: 0 0 auto;
    font-size: 11px;
    white-space: nowrap;
  }
  body #main .dgp-recently-viewed__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-columns: auto;
    gap: 16px 12px;
    overflow: visible;
    padding-bottom: 0;
    scroll-snap-type: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  body #main .dgp-shop-category-list__link { transition: none; }
}

/* A shared blue finish for primary actions across Flatsome, WooCommerce and forms. */
:root {
  --dgp-action-blue: #293992;
  --dgp-action-blue-hover: #1e2a6e;
  --dgp-action-blue-border: #1e2a6e;
  --dgp-action-ink: #fff;
  --dgp-action-outline-ink: #293992;
}
body #main :is(
  .button.primary,
  .dgp-btn-primary,
  .dgp-btn-primary .elementor-button,
  .ab-btn-primary .elementor-button,
  .dgp-visual-about-primary .elementor-button,
  .dgp-stop-copy .elementor-button,
  .dgp-design-ux-form input[type="submit"],
  .dgp-design-ux-form button[type="submit"],
  .dgp-pdp .single_add_to_cart_button,
  .dgp-new-arrivals-hero .button,
  .dgp-article__comments input[type="submit"],
  .dgp-article__body input[type="submit"],
  .dgp-new-arrivals__filter-actions button[type="submit"],
  .dgp-contact-v2 .wpcf7-submit,
  .dgp-cf7-submit,
  input[type="submit"],
  button[type="submit"]
) {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-ink) !important;
  box-shadow: 0 4px 14px rgba(114, 80, 29, .16);
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
body #main :is(
  .button.primary,
  .dgp-btn-primary,
  .dgp-btn-primary .elementor-button,
  .ab-btn-primary .elementor-button,
  .dgp-visual-about-primary .elementor-button,
  .dgp-stop-copy .elementor-button,
  .dgp-design-ux-form input[type="submit"],
  .dgp-design-ux-form button[type="submit"],
  .dgp-pdp .single_add_to_cart_button,
  .dgp-new-arrivals-hero .button,
  .dgp-article__comments input[type="submit"],
  .dgp-article__body input[type="submit"],
  .dgp-new-arrivals__filter-actions button[type="submit"],
  .dgp-contact-v2 .wpcf7-submit,
  .dgp-cf7-submit,
  input[type="submit"],
  button[type="submit"]
):not(:disabled):not([disabled]):not(.disabled):hover {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: var(--dgp-action-blue-hover) !important;
  color: var(--dgp-action-ink) !important;
  box-shadow: 0 6px 18px rgba(114, 80, 29, .22);
}
body #main :is(
  .button.primary,
  .dgp-btn-primary,
  .dgp-btn-primary .elementor-button,
  .ab-btn-primary .elementor-button,
  .dgp-visual-about-primary .elementor-button,
  .dgp-stop-copy .elementor-button,
  .dgp-design-ux-form input[type="submit"],
  .dgp-design-ux-form button[type="submit"],
  .dgp-pdp .single_add_to_cart_button,
  .dgp-new-arrivals-hero .button,
  .dgp-article__comments input[type="submit"],
  .dgp-article__body input[type="submit"],
  .dgp-new-arrivals__filter-actions button[type="submit"],
  .dgp-contact-v2 .wpcf7-submit,
  .dgp-cf7-submit,
  input[type="submit"],
  button[type="submit"]
):is(:disabled, [disabled], .disabled) {
  cursor: not-allowed;
  opacity: .58 !important;
  box-shadow: none;
}
body #main :is(a.button.is-outline:not(.icon):not(.circle), button.button.is-outline:not(.icon):not(.circle)) {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: transparent !important;
  color: var(--dgp-action-outline-ink) !important;
}
body #main :is(a.button.is-outline:not(.icon):not(.circle), button.button.is-outline:not(.icon):not(.circle)):not(:disabled):not([disabled]):hover {
  background-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-ink) !important;
}
body #main :is(
  .dgp-btn-outline .elementor-button,
  .ab-btn-outline .elementor-button,
  .dgp-visual-about-secondary .elementor-button
) {
  border-color: var(--dgp-action-blue) !important;
  background-color: transparent !important;
  color: var(--dgp-action-outline-ink) !important;
}
body #main :is(
  .dgp-btn-outline .elementor-button,
  .ab-btn-outline .elementor-button,
  .dgp-visual-about-secondary .elementor-button
):not(:disabled):hover {
  background-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-ink) !important;
}
body #main :is(
  .dgp-about-hero .dgp-btn-outline .elementor-button,
  .ab-hero .ab-btn-outline .elementor-button,
  .dgp-visual-about-hero-action .elementor-button
) {
  border-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-outline-ink) !important;
}
body #main .banner .button.is-outline:not(.icon):not(.circle) {
  border-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-outline-ink) !important;
}
body #main :is(
  .button.primary,
  .dgp-btn-primary .elementor-button,
  .ab-btn-primary .elementor-button,
  .dgp-visual-about-primary .elementor-button,
  .dgp-stop-copy .elementor-button,
  input[type="submit"],
  button[type="submit"]
):focus-visible {
  outline: 3px solid var(--dgp-action-blue-border) !important;
  outline-offset: 3px;
}
body #header .button.primary {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-ink) !important;
  box-shadow: 0 4px 14px rgba(114, 80, 29, .16);
}
body #header .button.primary:hover {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: var(--dgp-action-blue-hover) !important;
  color: var(--dgp-action-ink) !important;
}
body #footer .dgp-site-footer__consult-form :is(input[type="submit"], button[type="submit"]) {
  border-color: var(--dgp-action-blue-border) !important;
  background-color: var(--dgp-action-blue) !important;
  color: var(--dgp-action-ink) !important;
}
body #footer .dgp-site-footer__consult-form :is(input[type="submit"], button[type="submit"]):hover {
  background-color: var(--dgp-action-blue-hover) !important;
}

/* Keep the existing banner typography accents; CTA buttons use a clear white outline. */
body #main :is(
  .dgp-home-slider .dgp-banner-title h2 span + span,
  .dgp-home-slider .dgp-info-tag p,
  .dgp-home-slider .dgp-info-foot p,
  .dgp-new-arrivals-hero h1,
  .dgp-promotion-hero .dgp-promotion-hero-copy h1,
  .ab-hero__kicker .elementor-heading-title,
  .dgp-visual-about-title em
) {
  color: var(--dgp-gold) !important;
}
body #main :is(
  .banner .button.primary,
  .banner a.button:not(.is-outline):not(.white),
  .dgp-design-ux-hero .button:not(.is-outline),
  .dgp-new-arrivals-hero .button,
  .dgp-promotion-hero .button.primary,
  .dgp-visual-about-primary .elementor-button
) {
  border-color: #fff !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .38);
}
body #main :is(
  .banner .button.primary,
  .banner a.button:not(.is-outline):not(.white),
  .dgp-design-ux-hero .button:not(.is-outline),
  .dgp-new-arrivals-hero .button,
  .dgp-promotion-hero .button.primary,
  .dgp-visual-about-primary .elementor-button
):not(:disabled):not([disabled]):not(.disabled):is(:hover, :focus-visible) {
  border-color: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  color: #293992 !important;
  text-shadow: none;
}
body #main :is(
  .banner .button.is-outline:not(.icon):not(.circle),
  .dgp-design-ux-hero .button.is-outline,
  .dgp-new-arrivals-hero .button.is-outline,
  .dgp-promotion-hero .button.is-outline
) {
  border-color: #fff !important;
  background-color: transparent !important;
  color: #fff !important;
}
body #main :is(
  .banner .button.is-outline:not(.icon):not(.circle),
  .dgp-design-ux-hero .button.is-outline,
  .dgp-new-arrivals-hero .button.is-outline,
  .dgp-promotion-hero .button.is-outline
):not(:disabled):not([disabled]):not(.disabled):is(:hover, :focus-visible) {
  border-color: #fff !important;
  background-color: #fff !important;
  color: #293992 !important;
}

/* Homepage banner CTAs match the menu hover surface and keep white text. */
body #main .dgp-home-slider .dgp-banner-main .button,
body #main .dgp-home-slider .dgp-banner-main .button:is(:hover, :focus-visible) {
  border-color: #293992 !important;
  background: #293992 !important;
  background-image: none !important;
  color: #fff !important;
  text-shadow: none;
}

/* Plain, editable support documents: readable text without a page-builder layout. */
body #main .dgp-support-page {
  max-width: 920px;
  margin: 0 auto;
  padding: 44px 24px 64px;
  color: #30343b;
  font-family: "Be Vietnam Pro", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.8;
}
body #main .dgp-support-page h1 {
  margin: 16px 0 22px;
  color: #293992;
  font-size: clamp(25px, 3vw, 34px) !important;
  line-height: 1.35;
  font-weight: 700;
}
body #main .dgp-support-page h2 {
  margin: 30px 0 12px;
  color: #242b3a;
  font-size: 19px !important;
  line-height: 1.5;
  font-weight: 700;
}
body #main .dgp-support-page p { margin: 0 0 16px; }
body #main .dgp-support-page :is(ul, ol) { margin: 0 0 20px 22px; }
body #main .dgp-support-page li { margin: 0 0 8px; padding-left: 3px; }
body #main .dgp-support-page a { color: #293992; text-decoration: underline; text-underline-offset: 3px; }
body #main .dgp-support-page a:focus-visible { outline: 2px solid #293992; outline-offset: 4px; }
body #main .dgp-support-page__breadcrumb { font-size: 13px; color: #606875; }
body #main .dgp-support-page__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 24px;
  margin: 0 0 28px;
  padding: 8px 0;
  border-block: 1px solid #e2e5ec;
}
body #main .dgp-support-page__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 14px;
  text-decoration: none;
}
body #main .dgp-support-page__nav a[aria-current="page"] { font-weight: 700; text-decoration: underline; }
body #main .dgp-support-page__contact { margin-top: 32px; padding-top: 22px; border-top: 1px solid #e2e5ec; }
@media (max-width: 650px) {
  body #main .dgp-support-page { padding: 28px 20px 40px; font-size: 15px; }
  body #main .dgp-support-page__nav { gap: 0 20px; }
  body #main .dgp-support-page h2 { font-size: 18px !important; }
}

/* Header Zalo stays as an icon-only action on compact screens. */
@media (max-width: 849px) {
  #header a[href*="zalo.me"] > div {
    display: none !important;
  }

  #header a[href*="zalo.me"] {
    padding: 4px !important;
  }

  #header a[href*="zalo.me"] img {
    margin-right: 0 !important;
  }
}