/******************************
 * GLOBAL / RESET (mobile-first)
 ******************************/
html, body { width:100%; overflow-x:hidden; }
img, video, iframe, object, embed { max-width:100% !important; height:auto !important; display:block; }
.alignwide, .alignfull, figure, .wp-block-image { max-width:100%; }
.entry-content { font-size:clamp(15px,1.2vw + .4rem,17px); line-height:1.7; overflow-wrap:anywhere; word-break:break-word; }

/* Container gọn hơn trên mobile */
@media (max-width:1024px){
  .site-content .ast-container,
  .ast-plain-container .site-content .ast-container { padding-left:16px; padding-right:16px; }
}

/* Ẩn các thanh nổi/đè giao diện trên mobile (giữ cái nào thì bỏ selector tương ứng) */
@media (max-width:768px){
  .social-fixed-left, .floating-social, .zalo-chat-widget,
  .call-now-button, .hotline-fixed, .floating-contact, .share-bar,
  .fb-customerchat, .tawk-min-chat-icon, .sttb-wrapper { display:none !important; }
}

/************************ LAYOUT ************************/
.single-dich-vu-chinh .site-content .ast-container{
  display:flex; align-items:flex-start; gap:20px;
}
.single-dich-vu-chinh #primary.content-area{
  flex:1 1 auto; min-width:0; order:1; overflow-wrap:anywhere;
}

/* Sidebar sticky 250px (chỉ khi dùng sidebar) */
.single-dich-vu-chinh #secondary.widget-area{
  flex:0 0 250px; width:250px; max-width:250px; order:2;
  position:sticky; top:100px; align-self:flex-start; height:max-content;
  background:transparent; padding:0; margin:0; border:0; box-shadow:none;
  transform:translateZ(0); backface-visibility:hidden; contain:layout paint style;
}
body.admin-bar .single-dich-vu-chinh #secondary.widget-area{ top:132px; }

@media (max-width:921px){
  .single-dich-vu-chinh .site-content .ast-container{ flex-direction:column; gap:16px; }
  .single-dich-vu-chinh #secondary.widget-area{ position:static; width:100%; max-width:100%; }
}

/*********************** SIDEBAR – WIDGETS ************************/
/* Reset card ngoài của widget block */
.single-dich-vu-chinh #secondary .widget.widget_block{
  background:transparent; border:0; box-shadow:none; padding:0; margin:0 0 12px; border-radius:0;
}

/* Tiêu đề widget */
.single-dich-vu-chinh #secondary .widget.widget_block h2.wp-block-heading{
  margin:0; padding:10px 12px; line-height:1.2;
  color:#fff; font-weight:800; font-size:16px; text-transform:uppercase; letter-spacing:.35px;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  border-radius:0; border-bottom:2px solid rgba(0,0,0,.18);
}
/* Chu kỳ màu tiêu đề */
.single-dich-vu-chinh #secondary .widget.widget_block:nth-of-type(4n+1) h2.wp-block-heading{ background:#d62828; border-bottom-color:#a61d1d; }
.single-dich-vu-chinh #secondary .widget.widget_block:nth-of-type(4n+2) h2.wp-block-heading{ background:#0b5ed7; border-bottom-color:#0848a3; }
.single-dich-vu-chinh #secondary .widget.widget_block:nth-of-type(4n+3) h2.wp-block-heading{ background:#006600; border-bottom-color:#004d0a; }
.single-dich-vu-chinh #secondary .widget.widget_block:nth-of-type(4n)     h2.wp-block-heading{ background:#ff7a00; border-bottom-color:#cc6300; }

/* Thân widget */
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-group.is-layout-flow{
  background:#fff; border:1px solid rgba(0,0,0,.10); border-top:none;
  border-radius:0 0 6px 6px; padding:0; margin:0; overflow:hidden;
}

/* Danh sách phổ biến */
.single-dich-vu-chinh #secondary .widget.widget_block ul{ list-style:none; margin:0; padding:0; background:#fff; }
.single-dich-vu-chinh #secondary .widget.widget_block ul > li{ border-bottom:1px solid rgba(0,0,0,.10); }
.single-dich-vu-chinh #secondary .widget.widget_block ul > li:last-child{ border-bottom:0; }
.single-dich-vu-chinh #secondary .widget.widget_block ul > li > a{
  display:block; padding:10px 12px; text-decoration:none; color:#111;
}
.single-dich-vu-chinh #secondary .widget.widget_block ul > li > a:hover{ background:#f7f7f7; text-decoration:underline; }
.single-dich-vu-chinh #secondary .widget.widget_block ul > li > a::after{ content:none; display:none; }

/* Search block */
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-search__inside-wrapper{
  display:flex; gap:6px; padding:8px 12px; background:#fff;
  border:1px solid rgba(0,0,0,.10); border-top:none; border-radius:0 0 6px 6px;
}
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-search__inside-wrapper input[type="search"]{
  flex:1 1 auto; padding:8px 10px; border:1px solid #d9d9d9; border-radius:4px; color:#111;
}
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-search__inside-wrapper input[type="search"]::placeholder{ color:#777; }
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-search__button{
  padding:8px 10px; border-radius:4px; background:#111; color:#fff; border:0; font-weight:700;
}
.single-dich-vu-chinh #secondary .widget.widget_block .wp-block-search__button:hover{ opacity:.9; }

/************************ CONTENT BOXES ************************/
.single-dich-vu-chinh #primary .entry-content{ color:#111; }
.single-dich-vu-chinh #primary .entry-content a{ color:#111; text-decoration:underline; }

.single-dich-vu-chinh #primary .entry-content .info-box,
.single-dich-vu-chinh #primary .entry-content .table-box,
.single-dich-vu-chinh #primary .entry-content .gallery-box{
  background:#fff; border-left:5px solid #006600;
  border-radius:12px; padding:20px; margin-bottom:20px;
  box-shadow:0 4px 10px rgba(0,0,0,.08);
  transition:transform .25s ease, box-shadow .25s ease;
}
.single-dich-vu-chinh #primary .entry-content .info-box:hover,
.single-dich-vu-chinh #primary .entry-content .table-box:hover,
.single-dich-vu-chinh #primary .entry-content .gallery-box:hover{
  transform:translateY(-3px); box-shadow:0 12px 24px rgba(0,0,0,.12);
}
.single-dich-vu-chinh #primary .entry-content .info-box h2,
.single-dich-vu-chinh #primary .entry-content .table-box h2,
.single-dich-vu-chinh #primary .entry-content .gallery-box h2{ color:#006600; margin-bottom:14px; }

/************** TABLE (responsive) **************/
.single-dich-vu-chinh #primary .entry-content .table-box .table-wrap{ position:relative; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.single-dich-vu-chinh #primary .entry-content .table-box table{ width:100%; border-collapse:collapse; margin-top:18px; min-width:640px; }
.single-dich-vu-chinh #primary .entry-content .table-box th{ background:#006600; color:#fff; text-align:center; font-weight:700; }
.single-dich-vu-chinh #primary .entry-content .table-box td{ padding:10px; text-align:left; color:#333; }
.single-dich-vu-chinh #primary .entry-content .table-box tr:nth-child(even){ background:#f7faf8; }

/* Stack khi rất nhỏ */
@media (max-width:600px){
  .single-dich-vu-chinh #primary .entry-content .table-box table{ min-width:0; display:block; }
  .single-dich-vu-chinh #primary .entry-content .table-box thead{ display:none; }
  .single-dich-vu-chinh #primary .entry-content .table-box tbody{ display:grid; gap:10px; }
  .single-dich-vu-chinh #primary .entry-content .table-box tr{
    display:grid; gap:8px; border:1px solid #e5e7eb; border-radius:10px; padding:10px; background:#fff !important;
  }
  .single-dich-vu-chinh #primary .entry-content .table-box td{ border:none; padding:0; }
  .single-dich-vu-chinh #primary .entry-content .table-box td::before{
    content: attr(data-label) " "; display:block; font-weight:700; color:#111827; margin-bottom:2px;
  }
}

/************** GALLERY **************/
.single-dich-vu-chinh #primary .entry-content .gallery-box .gallery-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:15px;
}
.single-dich-vu-chinh #primary .entry-content .gallery-box .gallery-item{
  position:relative; overflow:hidden; border-radius:10px; box-shadow:0 4px 6px rgba(0,0,0,.12);
}
.single-dich-vu-chinh #primary .entry-content .gallery-box .gallery-item img{
  width:100%; height:auto; transition:transform .3s ease-in-out;
}
.single-dich-vu-chinh #primary .entry-content .gallery-box .gallery-item:hover img{ transform:scale(1.06); }
.single-dich-vu-chinh #primary .entry-content .gallery-box .gallery-caption{
  position:absolute; left:0; bottom:0; width:100%;
  background:linear-gradient(0deg,rgba(0,0,0,.55),rgba(0,0,0,0));
  color:#fff; text-align:center; padding:6px 8px; font-size:.9em;
}

/************************ FAQ ************************/
.single-dich-vu-chinh #primary .entry-content .faq-question{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; min-height:48px;
  background:#eef7ef; border:1px solid #cfe6d1; border-radius:10px;
  font-weight:700; color:#214; line-height:1.35;
  transition:background .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.single-dich-vu-chinh #primary .entry-content .faq-question::after{
  content:'+'; flex:0 0 28px; width:28px; height:28px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; background:#fff; border:1px solid #a6d5b0; color:#0a7a19; font-size:18px;
}
.single-dich-vu-chinh #primary .entry-content .faq-question.active{
  background:#e9f6ec; border-color:#aad7b6; box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.single-dich-vu-chinh #primary .entry-content .faq-question.active::after{ content:'–'; }
.single-dich-vu-chinh #primary .entry-content .faq-answer{
  display:block; margin:8px 0 14px; padding:12px 16px 14px;
  background:#fff; border:1px solid #e5f2e7; border-left:4px solid #006600;
  border-radius:0 10px 10px 10px; color:#333; line-height:1.6;
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height 300ms ease, opacity 250ms ease, border-color .2s ease;
}
.single-dich-vu-chinh #primary .entry-content .faq-answer + .faq-question{ margin-top:6px; }
.single-dich-vu-chinh #primary .entry-content .faq-question:focus{ outline:none; box-shadow:0 0 0 3px rgba(0,102,0,.18); }

/* === FIX: Căn giữa & cân lề cho single dich-vu-chinh === */

/* 1) Căn giữa toàn khối, padding 2 bên bằng nhau */
body.single-dich-vu-chinh .site-content .ast-container{
  margin-inline: auto;            /* ở giữa */
  padding-inline: 16px;           /* lề trái = lề phải */
  max-width: 1100px;              /* chỉnh tùy ý: 1000–1200px */
  box-sizing: border-box;
}

/* Nếu đang dùng sidebar 250px: vẫn giữa, vẫn cân lề */
@media (min-width: 922px){
  body.single-dich-vu-chinh #primary.content-area{ flex: 1 1 auto; }
  body.single-dich-vu-chinh #secondary.widget-area{ flex: 0 0 250px; }
}

/* 2) Trên mobile: tuyệt đối không “dày lề” bên trái */
@media (max-width: 921px){
  body.single-dich-vu-chinh .site-content .ast-container{
    padding-left: 14px;
    padding-right: 14px;
    max-width: 100%;              /* full chiều ngang màn hình */
  }
}

/* 3) Chặn mọi phần tử “thò” ra bên trái gây cảm giác lệch */
body.single-dich-vu-chinh .site-content .ast-container > *{
  max-width: 100%;
}
body.single-dich-vu-chinh .entry-content,
body.single-dich-vu-chinh .entry-content > *{
  margin-left: 0;
}
body.single-dich-vu-chinh .entry-content .alignfull,
body.single-dich-vu-chinh .entry-content .alignwide{
  margin-left: auto;
  margin-right: auto;
}

/* 4) Một số plugin/thanh nổi hay đẩy lệch – ép không chiếm lề */
@media (max-width: 1024px){
  .social-fixed-left, .floating-social, .share-bar,
  .hotline-fixed, .floating-contact { left: auto !important; right: 12px !important; }
}

/* 5) Nếu header/toolbar làm dịch bố cục, ép lại */
body.single-dich-vu-chinh .site-header,
body.single-dich-vu-chinh .main-header-bar{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* === SÁT LỀ HƠN TRÊN MOBILE (single dich-vu-chinh) === */

/* 1) Giảm lề 2 bên container */
@media (max-width: 921px){
  body.single-dich-vu-chinh .site-content .ast-container{
    max-width: 100%;
    padding-left: 8px !important;   /* trước 14–16px */
    padding-right: 8px !important;
    margin-left: auto;
    margin-right: auto;
  }
  /* Astra hay thêm padding vào bài viết đơn – bỏ luôn */
  .ast-separate-container .ast-article-single,
  .ast-plain-container .ast-article-single{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Bỏ padding của wrapper mặc định nếu có */
  .site-content, .site-main{ padding-left: 0 !important; padding-right: 0 !important; }
}

/* 2) Thu nhỏ đệm & viền của các box trong nội dung */
@media (max-width: 921px){
  .single-dich-vu-chinh #primary .entry-content .info-box,
  .single-dich-vu-chinh #primary .entry-content .table-box,
  .single-dich-vu-chinh #primary .entry-content .gallery-box{
    padding: 12px !important;            /* trước 20px */
    border-left-width: 3px !important;   /* trước 5px */
    border-radius: 10px;
    margin-left: 0;
    margin-right: 0;
  }
  /* Bảng: bỏ min-width để không tạo mép tràn */
  .single-dich-vu-chinh #primary .entry-content .table-box table{
    min-width: 0 !important;
  }
}

/* 3) Ẩn các thanh nổi chiếm chỗ hai bên trên mobile */
@media (max-width: 921px){
  .social-fixed-left, .floating-social, .share-bar,
  .zalo-chat-widget, .call-now-button, .hotline-fixed,
  .floating-contact, .sb-fixed-left, .fb-customerchat,
  .sttb-wrapper, .btn-fixed-right, .btn-fixed-left,
  .sticky-action-left, .sticky-action-right{
    display: none !important;
  }
}

/* 4) Đảm bảo mọi phần tử không “thò” ra hai mép */
body.single-dich-vu-chinh .entry-content *{
  max-width: 100% !important;
}
body.single-dich-vu-chinh .entry-content .alignfull,
body.single-dich-vu-chinh .entry-content .alignwide{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 5) Nếu vẫn dùng sidebar ở desktop: full-width trên mobile */
@media (max-width: 921px){
  .single-dich-vu-chinh #secondary.widget-area{
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* 6) Tăng vùng hiển thị nội dung chính – không viền “ảo” */
@media (max-width: 921px){
  .single-dich-vu-chinh #primary.content-area{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

