/* iNet-style theme override for domuc.vn (sub-pages only, NOT index)
   Palette: navy blue #1a4d8c + orange CTA #ff6b00 */

:root{
  --inet-primary:#1a4d8c;
  --inet-primary-dark:#143b6f;
  --inet-primary-light:#2563a8;
  --inet-accent:#ff6b00;
  --inet-accent-dark:#e55a00;
  --inet-accent-light:#ff8533;
  --inet-bg:#eef2f7;
  --inet-text:#1f2937;
  --inet-muted:#6b7280;
  --inet-border:#e5e7eb;
}

/* Top bar */
.top_bar,.top__bar,.top-bar{
  background:linear-gradient(90deg,#1a4d8c 0%,#143b6f 100%) !important;
  color:#fff !important;
}
.top_bar a,.top_bar h1{color:#fff !important;}

/* Header */
.header__main,.header__mobile{
  background:#fff !important;
  box-shadow:0 2px 8px rgba(26,77,140,.06);
}

/* Body bg */
body{background:#eef2f7 !important;}

/* Links */
a{color:#1a4d8c !important;}
a:hover{color:#ff6b00 !important;}
.top_bar a,.top_bar a:hover,
footer a,footer a:hover{color:#fff !important;}

/* Buttons / CTA */
.button,button,input[type="submit"],.btn,.read-more,.wpcf7-submit{
  background:#ff6b00 !important;
  color:#fff !important;
  border:none !important;
  border-radius:6px !important;
  padding:10px 22px !important;
  font-weight:600 !important;
  box-shadow:0 2px 6px rgba(255,107,0,.25);
}
.button:hover,button:hover,input[type="submit"]:hover,.btn:hover,.wpcf7-submit:hover{
  background:#e55a00 !important;
  transform:translateY(-1px);
}

/* Banner breadcrumb */
.bread__crumbs,.breadcrumb__,.banner-breadcrumb,
.breadcrumb-style,.breadcrumb__cus,
div.breadcrumb-style.breadcrumb__cus,
.page-title-bar,.page-banner,.inner-banner,.sub-banner{
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 50%,#1e40af 100%) !important;
  color:#fff !important;
}
.bread__crumbs h1,.bread__crumbs a,.bread__crumbs span,
.breadcrumb-style h1,.breadcrumb-style a,
.breadcrumb__cus h1,.breadcrumb__cus a,
.breadcrumb__cus nav,.breadcrumb__cus nav a,
.woocommerce-breadcrumb,.woocommerce-breadcrumb a{color:#fff !important;}

/* Cards */
.related-locations,.orphan-bridge,
section.related-locations,
.testimonial-block,.commitment-block{
  background:#fff !important;
  border:1px solid #e5e7eb !important;
  border-left:4px solid #1a4d8c !important;
  border-radius:8px !important;
}

/* Footer */
footer,footer.footer_area,.footer_area,.footer___main,
.footer,.footer__,#footer{
  background:linear-gradient(180deg,#143b6f 0%,#0f2c54 100%) !important;
  color:#fff !important;
}
footer *,.footer_area *,.footer___main *,#footer *{color:#fff !important;}
footer p,footer li,footer span,footer div,
.footer_area p,.footer_area li,.footer_area span,
.footer___main p,.footer___main li,.footer___main span,
#footer p,#footer li,#footer span{
  color:#f1f5f9 !important;
  font-size:14.5px !important;
  font-weight:500 !important;
  line-height:1.85 !important;
}
footer h1,footer h2,footer h3,footer h4,footer h5,
.footer_area h3,.footer_area h4,.footer_area h5,
.footer___main h3,.footer___main h4{
  color:#fff !important;
  font-weight:700 !important;
  border-bottom:2px solid #ff6b00 !important;
  padding-bottom:8px !important;
  margin-bottom:14px !important;
  display:inline-block;
}
.address_list,ul.address_list{
  list-style:none !important;
  padding:0 !important;
  margin:10px 0 0 !important;
}
.address_list li,ul.address_list li{
  padding:8px 0 !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  color:#fff !important;
  font-size:14.5px !important;
}
.address_list li strong{color:#ffd6a5 !important;font-weight:700 !important;}
.address_list li i{color:#ff8533 !important;font-size:15px !important;margin-right:6px;}

/* Forms */
input[type="text"],input[type="email"],input[type="tel"],
input[type="password"],input[type="number"],input[type="search"],
textarea,select{
  border:1px solid #d1d5db !important;
  border-radius:6px !important;
  padding:10px 14px !important;
  background:#fff !important;
}
input:focus,textarea:focus,select:focus{
  outline:none !important;
  border-color:#1a4d8c !important;
  box-shadow:0 0 0 3px rgba(26,77,140,.12) !important;
}

/* Tables */
table{border-collapse:collapse !important;border:1px solid #e5e7eb !important;}
table thead{background:#1a4d8c !important;color:#fff !important;}
table thead th{background:#1a4d8c !important;color:#fff !important;padding:12px !important;}
table tbody tr:nth-child(even){background:#f9fafb !important;}
table td{padding:10px 12px !important;border:1px solid #f3f4f6 !important;}

/* Sidebar widgets */
.widget__title,.widget-title,.sidebar__ h3,.sidebar__ h4,
._title_sidebar_category{
  color:#1a4d8c !important;
  border-bottom:2px solid #ff6b00 !important;
  padding-bottom:8px !important;
  margin-bottom:14px !important;
  font-weight:700 !important;
}

/* Mega menu plugin */
#mega-menu-wrap-menu-1,
#mega-menu-wrap-menu-1 #mega-menu-menu-1,
.mega-menu-wrap{
  background:#fff !important;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link{
  color:#1a4d8c !important;
  background:#fff !important;
  font-weight:600 !important;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item:hover > a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-current-menu-item > a.mega-menu-link{
  color:#ff6b00 !important;
  background:#f5f7fa !important;
}
ul.mega-sub-menu,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item ul.mega-sub-menu{
  background:#fff !important;
  box-shadow:0 8px 24px rgba(0,0,0,.12) !important;
  border-top:3px solid #1a4d8c !important;
}
ul.mega-sub-menu li.mega-menu-item a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item ul.mega-sub-menu li.mega-menu-item a.mega-menu-link{
  color:#1f2937 !important;
  background:#fff !important;
}
ul.mega-sub-menu li.mega-menu-item:hover > a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:hover{
  color:#ff6b00 !important;
  background:#fff5eb !important;
}

/* Float buttons - pill style với label */
.hotline_list{
  position:fixed !important;
  right:14px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  z-index:9999 !important;
}
.hotline_list .container{padding:0 !important;}
.hotline_list ul{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
}
.hotline_list li{margin:0 !important;display:block !important;}

/* Common pill style */
.tel__,a.tel__,
.zalo__,a.zalo__,
.hotline_list a[aria-label="fanpage"],
.hotline_list a[aria-label="messenger"]{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  width:auto !important;
  min-width:130px !important;
  height:auto !important;
  padding:10px 16px !important;
  border-radius:30px !important;
  text-decoration:none !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:14px !important;
  white-space:nowrap !important;
  transition:transform .2s,box-shadow .2s !important;
}
.tel__ span,
.zalo__ span,
.hotline_list a[aria-label="fanpage"] span,
.hotline_list a[aria-label="messenger"] span{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  height:auto !important;
}
.tel__ svg,.tel__ i,
.zalo__ svg,
.hotline_list a[aria-label="fanpage"] svg,
.hotline_list a[aria-label="messenger"] svg{
  width:18px !important;
  height:18px !important;
  flex-shrink:0;
}
.tel__ i{font-size:18px !important;}

/* Add label after icon using ::after */
.tel__::after,a.tel__::after{
  content:"Gọi ngay";
  margin-left:4px;
  font-weight:700;
}
.zalo__::after,a.zalo__::after{
  content:"Chat Zalo";
  margin-left:4px;
  font-weight:700;
}
.hotline_list a[aria-label="fanpage"]::after,
.hotline_list a[aria-label="messenger"]::after{
  content:"Messenger";
  margin-left:4px;
  font-weight:700;
}

/* Phone (orange) */
.tel__,a.tel__{
  background:linear-gradient(135deg,#ff6b00 0%,#ff8533 100%) !important;
  border:none !important;
  box-shadow:0 4px 16px rgba(255,107,0,.4) !important;
}
.tel__ i,.tel__ svg{color:#fff !important;fill:#fff !important;}
.tel__:hover{transform:translateX(-3px) !important;box-shadow:0 6px 20px rgba(255,107,0,.55) !important;}

/* Zalo (blue) */
.zalo__,a.zalo__{
  background:#0068ff !important;
  border:none !important;
  box-shadow:0 4px 16px rgba(0,104,255,.4) !important;
}
.zalo__ svg{fill:#fff !important;}
.zalo__:hover{transform:translateX(-3px) !important;box-shadow:0 6px 20px rgba(0,104,255,.55) !important;}

/* Messenger (Messenger blue) */
.hotline_list a[aria-label="fanpage"],
.hotline_list a[aria-label="messenger"]{
  background:linear-gradient(135deg,#0084ff 0%,#0066cc 100%) !important;
  border:none !important;
  box-shadow:0 4px 16px rgba(0,132,255,.4) !important;
}
.hotline_list a[aria-label="fanpage"] svg,
.hotline_list a[aria-label="messenger"] svg{fill:#fff !important;}
.hotline_list a[aria-label="fanpage"]:hover,
.hotline_list a[aria-label="messenger"]:hover{
  transform:translateX(-3px) !important;
  box-shadow:0 6px 20px rgba(0,132,255,.55) !important;
}

/* Hide mobile-only "Gọi điện" / "Chat zalo" / "Nhắn tin" labels under each btn (now redundant) */
.hotline_list li > p.d-block.d-md-none{display:none !important;}

/* Mobile: stack at bottom right, smaller */
@media(max-width:768px){
  .hotline_list{
    bottom:80px !important;
    top:auto !important;
    transform:none !important;
    right:10px !important;
  }
  .tel__,a.tel__,
  .zalo__,a.zalo__,
  .hotline_list a[aria-label="fanpage"],
  .hotline_list a[aria-label="messenger"]{
    min-width:auto !important;
    padding:8px 14px !important;
    font-size:13px !important;
  }
}

.cd-top,a.cd-top{
  background:#1a4d8c !important;
  color:#fff !important;
  border-radius:8px !important;
}

/* Override inline #49a010 */
[style*="#49a010"]{color:#1a4d8c !important;}
[style*="background:#49a010"],[style*="background: #49a010"]{background:#1a4d8c !important;}

/* Mobile */
@media(max-width:768px){
  .bread__crumbs h1{font-size:24px !important;}
  .button,.btn,.wpcf7-submit{padding:12px 20px !important;font-size:15px !important;}
}


/* ===== Section title PNG bg killer (THỦ THUẬT, DỊCH VỤ, BẢNG BÁO GIÁ...) ===== */
.title.text-center h3,
.product_title h3,
.bang_gia h4{
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  background-image:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  display:inline-block !important;
  padding:10px 24px !important;
  border-radius:6px !important;
  font-size:16px !important;
  font-weight:700 !important;
  text-transform:uppercase;
}

/* News section product_title strip green PNG */
.news .product_title{
  background:none !important;
  border-bottom:2px solid #1a4d8c;
  padding-bottom:6px;
  margin-bottom:18px !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
}

/* Hỗ trợ trực tuyến */
.title_ho_tro,
.title_ho_tro h3,
strong.title_product,
.title_product{
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  background-image:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  padding:12px 16px !important;
  display:block !important;
  text-align:center !important;
  border-radius:6px 6px 0 0 !important;
  font-weight:700 !important;
  text-transform:uppercase;
  font-size:15px !important;
  margin:0 !important;
}
.banner_hotro{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  overflow:hidden;
}
.ho__tro{padding:14px;}
.ho__tro_item,.content_hotro{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  padding:10px 0 !important;
  background:transparent !important;
  border-bottom:1px solid #f3f4f6 !important;
}
.ho__tro_item:last-child,.content_hotro:last-child,
.content_hotro.last__content{border-bottom:none !important;}
.ho__tro_item img,.content_hotro img{
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  object-fit:cover;
  flex:0 0 48px;
}
.content_hotline strong{
  color:#1a4d8c !important;
  display:block;
  font-weight:700 !important;
  font-size:13px !important;
}
.content_hotline p{
  color:#ff6b00 !important;
  font-weight:700 !important;
  font-size:14px !important;
  margin:2px 0 0 !important;
}

/* Sidebar service list (DỊCH VỤ left side bar with empty thumbnails) */
._title_sidebar_category{
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  padding:12px 16px !important;
  margin:0 !important;
  border-radius:6px 6px 0 0 !important;
  font-weight:700 !important;
  text-transform:uppercase;
  border-bottom:none !important;
  font-size:15px !important;
}
._title_sidebar_category span{color:#fff !important;}
._sidebar_category{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  margin-bottom:20px;
  overflow:hidden;
}
.ul_service{list-style:none !important;padding:8px 0 !important;margin:0 !important;}
.ul_service li{
  border-bottom:1px solid #f3f4f6;
  padding:10px 14px !important;
}
.ul_service li:last-child{border-bottom:none;}
.ul_service li a{
  color:#1f2937 !important;
  font-weight:500;
  display:block;
}
.ul_service li a h4{
  font-size:13px !important;
  margin:0 !important;
  font-weight:500 !important;
  color:#1f2937 !important;
}
.ul_service li:hover a h4{color:#ff6b00 !important;}

/* Item news thumbnails - if missing image, hide broken icon */
.item_tt img[src=""]{display:none;}
.item_tt{
  display:flex;
  gap:10px;
  padding:8px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:6px;
  margin-bottom:6px;
}
.item_tt:hover{border-color:#1a4d8c;}
.news_image_lt{flex:0 0 80px;max-width:80px;}
.news_image_lt img{width:80px;height:60px;object-fit:cover;border-radius:4px;}
.content_tt{flex:1;font-size:12px;}
.content_tt .text_title,
.content_tt .title a{
  color:#1a4d8c !important;
  font-weight:600 !important;
  font-size:12px !important;
  text-transform:uppercase;
  display:block;
  margin-bottom:4px;
  line-height:1.3;
}
.content_tt .text_content,
.content_tt p{
  color:#666 !important;
  font-size:11px !important;
  line-height:1.4 !important;
  margin:0 !important;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* btn_slide arrow icon (right of THỦ THUẬT/DỊCH VỤ) */
.product_title img{
  filter:hue-rotate(180deg) saturate(2);
}

/* Hide top-right "Banner" stray text/image if any */
section.banner > img:not([alt]){display:none;}


/* ===================================================== */
/* MOBILE OPTIMIZATION (iPhone-first)                    */
/* ===================================================== */

@media (max-width: 768px){
  /* Container padding */
  .container, .container-fluid{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  /* Top bar - compact on mobile */
  .top_bar{
    padding:6px 0 !important;
    font-size:11px !important;
  }
  .top_bar h1{font-size:11px !important;}
  .top_bar_list{gap:8px !important;flex-wrap:wrap;}

  /* Header logo */
  .header__logo__link img,
  .header__mobile img{
    max-height:50px !important;
  }

  /* Breadcrumb banner - smaller */
  .bread__crumbs,
  .breadcrumb-style,
  .breadcrumb__cus{
    height:auto !important;
    min-height:120px !important;
    padding:30px 15px !important;
    margin-bottom:20px !important;
  }
  .bread__crumbs h1,
  .breadcrumb-style h1,
  .breadcrumb__cus h1{
    font-size:20px !important;
    line-height:1.3 !important;
    margin-bottom:6px !important;
  }
  .bread__crumbs ul,
  .breadcrumb-style ul,
  .breadcrumb__cus ul{font-size:12px !important;}

  /* Single post title */
  ._title_single_post{
    font-size:22px !important;
    line-height:1.3 !important;
    margin:14px 0 12px !important;
  }

  /* Content typography */
  ._content_single_post p,
  ._content_single_post li{
    font-size:15px !important;
    line-height:1.65 !important;
  }
  ._content_single_post h2{
    font-size:19px !important;
    margin:20px 0 10px !important;
  }
  ._content_single_post h3{
    font-size:17px !important;
    margin:16px 0 8px !important;
  }

  /* Tables become scrollable */
  table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
    max-width:100%;
  }
  table td,table th{
    padding:8px !important;
    font-size:13px !important;
  }

  /* Inline quote cards - stack */
  [style*="display:flex"][style*="flex-wrap:wrap"]{
    flex-direction:column !important;
  }

  /* CTA box smaller padding */
  [style*="linear-gradient(135deg,#1a4d8c"]{
    padding:18px 14px !important;
  }
  [style*="linear-gradient(135deg,#1a4d8c"] a{
    font-size:18px !important;
  }

  /* Buttons - touch target 44px+ */
  .button,button,input[type="submit"],.btn,.read-more,.wpcf7-submit,
  a.cta-call,a.cta-fb,a.cta-bar,
  .ho__tro_item a, .content_hotro a{
    min-height:44px !important;
    padding:12px 18px !important;
    font-size:15px !important;
  }

  /* Float buttons - smaller on mobile */
  .tel__,.zalo__,
  a[aria-label="phone-alo"],a[aria-label="zalo"],a[aria-label="fanpage"]{
    width:50px !important;
    height:50px !important;
  }
  .hotline_list ul{
    bottom:90px !important;
  }

  /* Footer columns stack */
  .footer___main .col-lg-6,
  .footer___main .col-lg-3,
  .footer___main .col-md-6{
    flex:0 0 100% !important;
    max-width:100% !important;
    margin-bottom:24px;
  }
  .footer___main h3{font-size:16px !important;}
  .address_list li{
    font-size:13px !important;
    padding:6px 0 !important;
  }

  /* Mobile menu drawer - already in plugin CSS */

  /* Service item cards - 2 cols on mobile */
  .container_icons_item{
    flex:0 0 calc(50% - 8px) !important;
    min-width:0 !important;
  }

  /* Forms */
  input[type="text"],input[type="email"],input[type="tel"],
  input[type="password"],input[type="search"],textarea,select{
    font-size:16px !important; /* iOS zoom prevention */
    padding:12px 14px !important;
  }

  /* Geo widget - already responsive in JS but enforce */
  #cn-geo-widget{
    left:8px !important;
    right:8px !important;
    bottom:90px !important;
    max-width:none !important;
    padding:12px !important;
  }

  /* Testimonial carousel - 1 col on mobile */
  .testimonial-grid{grid-template-columns:1fr !important;}
  .testimonial-prev,.testimonial-next{
    width:36px !important;
    height:36px !important;
    left:0 !important;
    right:0 !important;
  }
  .testimonial-prev{left:-4px !important;}
  .testimonial-next{right:-4px !important;}

  /* Internal links block */
  .related-locations ul{
    column-count:1 !important;
  }
  .related-locations h3{font-size:16px !important;}

  /* Hide stats user counter on mobile (less important) */
  .statistics-user{display:none !important;}

  /* Fanpage card */
  .facebook__fanpage{margin-bottom:16px;}
}

@media (max-width: 480px){
  /* iPhone SE / smaller phones */
  .bread__crumbs h1,
  .breadcrumb-style h1{font-size:18px !important;}
  ._title_single_post{font-size:20px !important;}

  .container_icons_item{
    flex:0 0 100% !important;
  }

  /* Hero banner CTA stacking */
  [style*="display:flex"][style*="gap:12px"][style*="justify-content:center"] a{
    width:100% !important;
    text-align:center !important;
  }

  /* Smaller heading inside content */
  ._content_single_post h2{font-size:17px !important;}
}

/* Touch-friendly tap targets */
@media (hover: none) and (pointer: coarse){
  a, button, input[type="submit"]{
    min-height:44px;
  }
}


/* ===================================================== */
/* FLOATING SEARCH BUTTON (top-right) - always visible   */
/* ===================================================== */
#cn-search-fab{
  position:fixed !important;
  top:18px !important;
  right:18px !important;
  z-index:9998 !important;
  height:48px !important;
  padding:0 22px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  border:none !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  box-shadow:0 4px 14px rgba(26,77,140,.4) !important;
  transition:all .2s ease !important;
  font-family:inherit;
  font-size:15px !important;
  font-weight:600 !important;
}
#cn-search-fab:hover{
  background:linear-gradient(135deg,#143b6f 0%,#1e40af 100%) !important;
  transform:scale(1.05) !important;
  box-shadow:0 6px 18px rgba(26,77,140,.55) !important;
}
#cn-search-fab svg{
  width:20px !important;
  height:20px !important;
  fill:#fff !important;
  flex-shrink:0;
}
#cn-search-fab .label{
  display:inline !important;
  color:#fff !important;
  font-weight:600;
  font-size:15px;
}
#cn-search-fab .kbd{
  display:inline-block !important;
  background:rgba(255,255,255,.2);
  color:#fff !important;
  padding:3px 8px;
  border-radius:4px;
  font-size:11px;
  margin-left:4px;
  font-family:monospace;
  font-weight:500;
}
@media(max-width:768px){
  #cn-search-fab{
    top:auto !important;
    bottom:140px !important;
    right:14px !important;
    width:50px !important;
    height:50px !important;
    padding:0 !important;
    border-radius:50% !important;
  }
  #cn-search-fab .label,
  #cn-search-fab .kbd{display:none !important;}
  #cn-search-fab svg{width:24px !important;height:24px !important;}
}


/* ===================================================== */
/* SIDEBAR FIXES (override broken theme styles)          */
/* ===================================================== */
h4._title_sidebar_category,
h4._title_sidebar_product,
._title_sidebar_category,
._title_sidebar_product{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:15px !important;
  font-weight:700 !important;
  text-align:center !important;
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  background-image:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  padding:12px 16px !important;
  margin:0 !important;
  text-transform:uppercase !important;
  letter-spacing:.5px !important;
  border-radius:6px 6px 0 0 !important;
  border-bottom:2px solid #ff6b00 !important;
  display:block !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
h4._title_sidebar_category span,
h4._title_sidebar_product span{
  color:#fff !important;
  display:inline !important;
  font-family:inherit !important;
}

#sidebar-cate{
  position:sticky;
  top:14px;
  margin-top:0;
}
#sidebar-cate ._sidebar_category{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  margin-bottom:18px;
  overflow:hidden;
}
#sidebar-cate ._sidebar_category .ul_service,
#sidebar-cate ._sidebar_category .news__post__list,
#sidebar-cate ._sidebar_category ul{
  list-style:none !important;
  padding:6px 0 !important;
  margin:0 !important;
}
#sidebar-cate ._sidebar_category li{
  border-bottom:1px solid #f3f4f6;
  padding:0 !important;
  margin:0 !important;
}
#sidebar-cate ._sidebar_category li:last-child{border-bottom:none;}
#sidebar-cate ._sidebar_category li a{
  display:block;
  padding:10px 14px;
  color:#1f2937 !important;
  font-size:13px !important;
  text-decoration:none !important;
  transition:all .15s;
}
#sidebar-cate ._sidebar_category li a:hover{
  background:#f0f7ff;
  color:#ff6b00 !important;
}
#sidebar-cate ._sidebar_category li a h4,
#sidebar-cate ._sidebar_category li a .line-text-2{
  font-size:13px !important;
  font-weight:500 !important;
  color:inherit !important;
  margin:0 !important;
  font-family:inherit !important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.4;
}

/* Fix any other elements using font-family:'title' (non-existent) */
[style*="font-family:'title'"],
[style*="font-family: 'title'"]{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}

/* Position search FAB lower so it doesn't overlap top nav */
@media(min-width:1024px){
  #cn-search-fab{
    top:90px !important;
    right:20px !important;
  }
}


/* ===================================================== */
/* FORCE SIDEBAR LAYOUT (override broken Bootstrap col)  */
/* ===================================================== */
@media(min-width:992px){
  .container .row > .col-lg-9{
    flex:0 0 75% !important;
    max-width:75% !important;
  }
  .container .row > .col-lg-3{
    flex:0 0 25% !important;
    max-width:25% !important;
    padding-left:14px !important;
  }
}
@media(max-width:991px){
  .container .row > .col-lg-3{
    flex:0 0 100% !important;
    max-width:100% !important;
    margin-top:30px;
  }
}

/* Sidebar width minimum + force horizontal text */
#sidebar-cate,
.col-lg-3 #sidebar-cate{
  min-width:240px !important;
  width:100% !important;
}
#sidebar-cate ._sidebar_category{
  width:100% !important;
  display:block !important;
}
#sidebar-cate h4._title_sidebar_category,
#sidebar-cate ._title_sidebar_category{
  width:100% !important;
  display:block !important;
  white-space:normal !important;
  word-break:keep-all !important;
  letter-spacing:normal !important;
  writing-mode:horizontal-tb !important;
  text-orientation:mixed !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.4 !important;
  text-align:center !important;
  background:linear-gradient(135deg,#1a4d8c 0%,#2563a8 100%) !important;
  color:#fff !important;
  padding:12px 14px !important;
  margin:0 !important;
  text-transform:uppercase !important;
  border-radius:6px 6px 0 0 !important;
  border-bottom:2px solid #ff6b00 !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
#sidebar-cate h4._title_sidebar_category span,
#sidebar-cate ._title_sidebar_category span{
  display:inline !important;
  white-space:normal !important;
  word-break:keep-all !important;
  letter-spacing:normal !important;
  writing-mode:horizontal-tb !important;
  font-family:inherit !important;
  font-size:inherit !important;
  font-weight:inherit !important;
  color:#fff !important;
}


/* ===================================================== */
/* COPYRIGHT FOOTER STATISTICS BAR                       */
/* ===================================================== */
.copyright_content,
.copyright,
footer .copyright_content{
  background:#0f2c54 !important;
  padding:14px 0 !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
}
.copyright_content > .row,
.copyright_content .container > .row{
  align-items:center !important;
}
.copyright_content p,
.copyright_content > div p{
  color:#fff !important;
  font-size:13px !important;
  font-weight:600 !important;
  margin:0 !important;
}
.statistics-user{
  list-style:none !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px 14px !important;
  margin:0 !important;
  padding:0 !important;
  justify-content:flex-end !important;
}
.statistics-user li{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:4px 10px !important;
  background:rgba(255,255,255,.08) !important;
  border-radius:20px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  font-size:12px !important;
  white-space:nowrap !important;
}
.statistics-user li img{
  width:18px !important;
  height:18px !important;
  border-radius:50% !important;
  object-fit:cover !important;
  filter:brightness(0) invert(1) opacity(.7);
}
.statistics-user li span{
  color:#fff !important;
  font-weight:500 !important;
  font-size:12px !important;
}
.statistics-user li span strong{
  color:#ffd6a5 !important;
  font-weight:700 !important;
  margin-right:2px !important;
}
.statistics-user li[data-stat] span{
  font-variant-numeric:tabular-nums;
}
/* Online indicator (1st li) - green dot */
.statistics-user li:first-child::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 8px #22c55e;
  animation:cnPulse 2s infinite;
  margin-right:2px;
}
@keyframes cnPulse{
  0%,100%{opacity:1;transform:scale(1);}
  50%{opacity:.6;transform:scale(.85);}
}
@media(max-width:768px){
  .statistics-user{justify-content:center !important;margin-top:10px !important;}
  .copyright_content{text-align:center !important;}
}


/* ===================================================== */
/* DISABLE PULSE ANIMATIONS on tel/zalo float buttons   */
/* ===================================================== */
.hotline_list .tel__,
.hotline_list .zalo__,
.hotline_list a.tel__,
.hotline_list a.zalo__,
.hotline_list a[aria-label="phone-alo"],
.hotline_list a[aria-label="zalo"],
a.tel__,a.zalo__,
.tel__,.zalo__,
section.hotline_list ul li a{
  animation:none !important;
  -webkit-animation:none !important;
}
.hotline_list .tel__::before,
.hotline_list .zalo__::before,
.hotline_list .tel__::after,
.hotline_list .zalo__::after{
  animation:none !important;
  -webkit-animation:none !important;
}
/* Override original pulseRing keyframes to be static */
@keyframes pulseRing{
  0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.18) !important;}
}
@-webkit-keyframes pulseRing{
  0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.18) !important;}
}
@keyframes pulseGreen{
  0%,100%{transform:scale(1) !important;opacity:0 !important;}
}
@-webkit-keyframes pulseGreen{
  0%,100%{transform:scale(1) !important;opacity:0 !important;}
}
/* Suntory phone (mobile-only bottom-left ringing) - kill animations */
.suntory-alo-phone,
.suntory-alo-phone *,
.suntory-alo-ph-circle,
.suntory-alo-ph-circle-fill,
.suntory-alo-ph-img-circle,
.suntory-alo-ph-img-circle i{
  animation:none !important;
  -webkit-animation:none !important;
}


/* ===================================================== */
/* SIDEBAR LINK TEXT - show full title in 2 lines        */
/* ===================================================== */
.ul_service li a h4.line-text-2,
.ul_service h4.line-text-2,
#sidebar-cate .line-text-2{
  font-size:13px !important;
  line-height:1.4 !important;
  font-weight:500 !important;
  color:inherit !important;
  margin:0 !important;
  font-family:inherit !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  word-break:normal !important;
  white-space:normal !important;
  max-width:100% !important;
}


/* ===================================================== */
/* MOBILE: 2-column grid for icon cards (compact)        */
/* ===================================================== */
@media(max-width:768px){
  /* 6 ô uy tín / cam kết / commitment - 2 cột */
  .container_icons,
  .commitment-section [style*="grid-template-columns"],
  .commitment-block [style*="grid-template-columns"],
  ._content_single_post [style*="grid-template-columns:repeat(auto-fit,minmax(220px,1fr))"],
  ._content_single_post [style*="grid-template-columns:repeat(auto-fit,minmax(160px,1fr))"]{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
  .container_icons_item{
    flex:0 0 auto !important;
    min-width:0 !important;
    width:auto !important;
    padding:14px 8px !important;
  }
  .container_icons_item h2,
  .container_icons_item h3,
  .container_icons_item div[style*="font-weight:700"]{
    font-size:12px !important;
    line-height:1.3 !important;
  }
  .container_icons_item i,
  .container_icons_item span.emoji-icon,
  .container_icons_item div[style*="font-size:36px"],
  .container_icons_item div[style*="font-size:42px"]{
    font-size:26px !important;
    margin-bottom:6px !important;
  }

  /* Service items (Đổ mực / Sửa chữa / Photocopy) - 2 cột */
  .service .row.row-center-cus,
  section.service .row{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    margin:0 !important;
  }
  .service .col-lg-4,
  .service .col-md-6,
  .service .offset-lg-4,
  .service .offset-md-3{
    flex:0 0 auto !important;
    max-width:none !important;
    margin-left:0 !important;
    padding:0 !important;
  }
  .service_item{
    padding:14px 8px !important;
    margin-bottom:0 !important;
  }
  .service_item_content h3,
  .service_item_content h3 a{
    font-size:13px !important;
    line-height:1.3 !important;
  }
  .service_item_content p{
    font-size:11px !important;
    line-height:1.4 !important;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
  }
  .service_item_img img{
    max-width:32px !important;
  }

  /* 4 thẻ dịch vụ inline (Đổ mực/Sửa chữa..) trên trang chủ - 2 cột */
  ._content_single_post a[href*="do-muc-may-in-tan-noi"][style],
  ._content_single_post a[href*="sua-chua-may-in-tan-noi"][style],
  ._content_single_post a[href*="do-muc-may-photocopy"][style],
  ._content_single_post a[href*="sua-chua-may-photocopy"][style]{
    padding:18px 12px !important;
  }
  ._content_single_post a[style*="text-decoration:none"][style*="border-radius:10px"] h3{
    font-size:13px !important;
    line-height:1.3 !important;
  }
  ._content_single_post a[style*="text-decoration:none"][style*="border-radius:10px"] p{
    font-size:11px !important;
  }
  ._content_single_post a[style*="text-decoration:none"][style*="border-radius:10px"] div[style*="font-size:42px"]{
    font-size:32px !important;
  }
}

@media(max-width:480px){
  /* Trên màn cực nhỏ giữ 2 cột nhưng giảm padding */
  .container_icons_item{padding:10px 6px !important;}
  .container_icons_item h2{font-size:11px !important;}
  .service_item{padding:12px 6px !important;}
}


/* ===================================================== */
/* MOBILE: Compact <ol> step list (Quy trình 7-8 bước)   */
/* ===================================================== */
@media(max-width:768px){
  /* Process / quy trình ol list - 2 cột compact */
  ._content_single_post ol,
  .process_content ol,
  ol[style*="counter-reset:step"]{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    padding:0 !important;
    list-style:none !important;
  }
  ._content_single_post ol li,
  .process_content ol li,
  ol[style*="counter-reset:step"] li{
    padding:10px 8px 10px 36px !important;
    margin-bottom:0 !important;
    background:#f5f7fa !important;
    border-radius:6px !important;
    border-left:3px solid #1a4d8c !important;
    font-size:11.5px !important;
    line-height:1.4 !important;
    position:relative !important;
    min-height:50px;
    display:flex !important;
    align-items:center !important;
  }
  ._content_single_post ol li::before,
  .process_content ol li::before,
  ol[style*="counter-reset:step"] li::before{
    width:22px !important;
    height:22px !important;
    font-size:11px !important;
    left:8px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
  }

  /* Process section - simplify on mobile */
  .process_content ol{padding:0 !important;}
  .process_content .row > div{flex:0 0 100% !important;max-width:100% !important;}
  .process_content .col-lg-5{display:none !important;} /* Hide decorative image on mobile */
}

@media(max-width:480px){
  /* iPhone SE - giảm font hơn */
  ._content_single_post ol li,
  .process_content ol li,
  ol[style*="counter-reset:step"] li{
    font-size:11px !important;
    padding:8px 6px 8px 32px !important;
    line-height:1.35 !important;
    min-height:46px;
  }
  ._content_single_post ol li::before,
  ol[style*="counter-reset:step"] li::before{
    width:20px !important;
    height:20px !important;
    font-size:10px !important;
    left:6px !important;
  }
}