@media screen and (min-width:981px){
  html.gsmview-dark,
  html.gsmview-dark body,
  html.gsmview-dark body #outer-wrapper,
  html.gsmview-dark body #top-bar,
  html.gsmview-dark body #header-wrap,
  html.gsmview-dark body #header-inner,
  html.gsmview-dark body #header-wrap > .container,
  html.gsmview-dark body #header-wrap .container.row,
  html.gsmview-dark body #header-wrap .header-header,
  html.gsmview-dark body .header-header,
  html.gsmview-dark body .header-menu,
  html.gsmview-dark body .mobile-header{
    background:#0f1115!important;
    background-color:#0f1115!important;
    background-image:none!important;
    border-top:0!important;
    border-bottom:0!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
    filter:none!important;
  }

  /* Remove only a possible light separator belonging to the header itself. */
  html.gsmview-dark body #top-bar,
  html.gsmview-dark body #header-wrap,
  html.gsmview-dark body #header-inner{
    border-color:#0f1115!important;
  }
}



@media screen and (min-width:981px){
  html.gsmview-dark #header-wrap #nav-search,
  html.gsmview-dark #nav-search{
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  html.gsmview-dark #header-wrap #nav-search .search-form,
  html.gsmview-dark #nav-search .search-form{
    background:#181b21!important;
    background-color:#181b21!important;
    border:1px solid #343a46!important;
    border-color:#343a46!important;
    outline:0!important;
    box-shadow:none!important;
  }
}



html.gsmview-dark{background:#0f1115!important;color:#f2f4f7!important;color-scheme:dark!important;}
html.gsmview-dark body{background:#0f1115!important;color:#f2f4f7!important;color-scheme:dark!important;}
/* EARLY DARK CARD PAINT: apply the final dark card/frame surfaces before the
   Blogger body finishes rendering, preventing the ~1s white-speck flash.
   This does not change affiliate logic, card dimensions, radius, or image sizing. */
html.gsmview-dark body #Blog1,
html.gsmview-dark body #Blog1 .index-post-wrap,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .index-post{
  background:#0f1115!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
  background:#181b21!important;
  border-color:#303641!important;
  background-clip:padding-box!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-link,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-thumb{
  background:#0f1115!important;
  border-color:transparent!important;
  outline:0!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
  background:#181b21!important;
}
/* Instant mode switch: do not animate the page while changing Normal/Night mode. */
html.gsmview-mode-switching,
html.gsmview-mode-switching body,
html.gsmview-mode-switching body *,
html.gsmview-mode-switching body *::before,
html.gsmview-mode-switching body *::after{
  transition:none!important;
  animation:none!important;
}



  .firstcharacter{
    float:left;
    color:#27ae60;
    font-size:75px;
    line-height:60px;
    padding-right:8px;
}
 .post-body p{
    margin-bottom:25px
}
 .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{
    color:#000;
    line-height:1.3em;
    margin:0 0 20px
}
 .post-body img{
    height:auto!important
}
 blockquote{
    position:relative;
    background-color:rgba(155,155,155,0.05);
    color:#000000;
    font-style:normal;
    padding:20px 25px;
    margin:0;
    border-radius:3px
}
 blockquote:before{
    position:absolute;
    left:10px;
    top:10px;
    content:'\f10e';
    font-family:FontAwesome;
    font-size:33px;
    font-style:normal;
    font-weight:900;
    color:#000;
    line-height:1;
    opacity:.05;
    margin:0
}
 .post-body .responsive-video-wrap{
    position:relative;
    width:100%;
    padding:0;
    padding-top:56%
}
 .post-body .responsive-video-wrap iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%
}
 .post-body ul{
    padding:0 0 0 15px;
    margin:10px 0
}
 .post-body li{
    margin:5px 0;
    padding:0
}
 .post-body ul li,.post-body ol ul li{
    list-style:none
}
 .post-body ul li:before{
    display:inline-block;
    content:'\2022';
    margin:0 5px 0 0
}
 .post-body ol{
    counter-reset:ify;
    padding:0 0 0 15px;
    margin:10px 0
}
 .post-body ol > li{
    counter-increment:ify;
    list-style:none
}
 .post-body ol > li:before{
    display:inline-block;
    content:counters(ify,'.')'.';
    margin:0 5px 0 0
}
 .post-body u{
    text-decoration:underline
}
 .post-body strike{
    text-decoration:line-through
}
 .post-body sup{
    vertical-align:super
}
 .post-body a{
  
}
 .post-body a:hover{
}
 .post-body a.button{
    display:inline-block;
    height:34px;
    background-color:#2c3e50;
    font-size:14px;
    color:#ffffff;
    font-weight:400;
    line-height:34px;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
    padding:0 20px;
    margin:0 6px 8px 0
}
 .post-body a.colored-button{
    color:#fff
}
 .post-body a.button:hover{
    background-color:#f47500;
    color:#fff
}
 .post-body a.colored-button:hover{
    background-color:#f47500!important;
    color:#fff!important
}
 .button:before{
    float:left;
    font-family:FontAwesome;
    font-weight:900;
    display:inline-block;
    margin:0 8px 0 0
}
 .button.preview:before{
    content:'\f06e'
}
 .button.download:before{
    content:'\f019'
}
 .button.link:before{
    content:'\f0c1'
}
 .button.cart:before{
    content:'\f07a'
}
 .button.info:before{
    content:'\f06a'
}
 .button.share:before{
    content:'\f1e0'
}
 .button.contact:before{
    content:'\f0e0';
    font-weight:400
}
 .alert-message{
    position:relative;
    display:block;
    padding:15px;
    border:1px solid rgba(155,155,155,0.1);
    border-radius:3px
}
 .alert-message.alert-success{
    background-color:rgba(34,245,121,0.03);
    border:1px solid rgba(34,245,121,0.5)
}
 .alert-message.alert-info{
    background-color:rgba(55,153,220,0.03);
    border:1px solid rgba(55,153,220,0.5)
}
 .alert-message.alert-warning{
    background-color:rgba(185,139,61,0.03);
    border:1px solid rgba(185,139,61,0.5)
}
 .alert-message.alert-error{
    background-color:rgba(231,76,60,0.03);
    border:1px solid rgba(231,76,60,0.5)
}
 .alert-message:before{
    font-family:FontAwesome;
    font-size:16px;
    font-weight:900;
    display:inline-block;
    margin:0 5px 0 0
}
 .alert-message.alert-success:before{
    content:'\f058';
    color:rgba(34,245,121,1)
}
 .alert-message.alert-info:before{
    content:'\f05a';
    color:rgba(55,153,220,1)
}
 .alert-message.alert-warning:before{
    content:'\f06a';
    color:rgba(185,139,61,1)
}
 .alert-message.alert-error:before{
    content:'\f057';
    color:rgba(231,76,60,1)
}
 .post-body table{
    width:100%;
    overflow-x:auto;
    text-align:left;
    margin:0;
    border-collapse:collapse;
    border:1px solid #161619
}
 
 .post-body table td,.post-body table th{
    padding:7px 15px;
    border:1px solid #161619
}
 .post-body table thead th{
    color:#000;
    font-weight:700;
    text-align:left;
    vertical-align:bottom
}
 table.tr-caption-container,table.tr-caption-container td,table.tr-caption-container th{
    line-height:1;
    padding:0;
    border:0
}
 table.tr-caption-container td.tr-caption{
    font-size:13px;
    color:#666666;
    padding:6px 0 0
}
 .tocify-wrap{
    display:flex;
    width:100%;
    clear:both;
    margin:0
}
 .tocify-inner{
    position:relative;
    max-width:100%;
    background-color:rgba(155,155,155,0.05);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    font-size:14px;
    color:#000000;
    line-height:1.6em;
    border:1px solid rgba(155,155,155,0.1);
    border-radius:3px
}
 a.tocify-title{
    position:relative;
    height:38px;
    font-size:16px;
    color:#000000;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 15px;
    margin:0
}
 .tocify-title-text{
    display:flex
}
 .tocify-title-text:before{
    content:'\f0cb';
    font-family:FontAwesome;
    font-size:14px;
    font-weight:900;
    margin:0 6px 0 0
}
 .tocify-title:after{
    content:'\f078';
    font-family:FontAwesome;
    font-size:12px;
    font-weight:900;
    margin:0 0 0 25px
}
 .tocify-title.is-expanded:after{
    content:'\f077'
}
 a.tocify-title:hover{
    text-decoration:none
}
 #tocify{
    display:none;
    padding:0 15px 10px;
    margin:0
}
 #tocify ol{
    padding:0 0 0 15px
}
 .rtl #tocify ol{
    padding:0 15px 0 0
}
 #tocify li{
    font-size:14px;
    margin:8px 0
}
 #tocify li a{
    color:#f47500
}
 #tocify li a:hover{
    color:#f47500;
    text-decoration:underline
}
 .post-body .contact-form{
    display:table;
}
 .contact-form .widget-title{
    display:none
}
 .contact-form .contact-form-name{
    width:calc(50% - 5px)
}
 .contact-form .contact-form-email{
    float:right;
    width:calc(50% - 5px)
}
 .post-body pre,pre.code-box{
    position:relative;
    display:block;
    background-color:rgba(155,155,155,0.05);
    font-family:Monospace;
    font-size:13px;
    color:#47474a;
    white-space:pre-wrap;
    line-height:1.4em;
    padding:15px;
    margin:0;
    border:1px solid rgba(155,155,155,0.1);
    border-radius:3px
}
 .post-body .google-auto-placed{
    margin:25px 0
}
  #hidden-widgets-wrap,.hidden-widgets{
    display:none;
    visibility:hidden
}
  @media only screen and (max-width: 680px) {
.post-body table {
    display: block;
}
  }



/* GSM VIEW - premium mobile menu close button ONLY */
#gsm-arrow-close{
  display:none;
  position:fixed;
  right:42px;
  top:calc(50% - 87px);
  top:calc(50dvh - 87px);
  transform:translateY(-50%);
  width:32px;
  height:32px;
  z-index:99999;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  background:linear-gradient(145deg,#3b8cff 0%,#1976ff 55%,#0757d9 100%);
  color:#fff;
  font-size:0;
  line-height:48px;
  text-align:center;
  padding:0;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  box-shadow:0 8px 20px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  overflow:visible;
}
#gsm-arrow-close:before{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:13px;
  height:13px;
  border-left:3px solid #fff;
  border-bottom:3px solid #fff;
  transform:translate(-32%,-50%) rotate(45deg);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));
}
/* Dark mode: ONLY the existing blue button's arrow is forced white.
   No size, position, background, or other button styling is changed. */
html.gsmview-dark #gsm-arrow-close:before{
  border-left-color:#fff!important;
  border-bottom-color:#fff!important;
}
#gsm-arrow-close:after{
  content:'';
  position:absolute;
  left:6px;
  right:6px;
  top:6px;
  height:12px;
  border-radius:50%;
  background:linear-gradient(to bottom,rgba(255,255,255,.28),rgba(255,255,255,0));
  pointer-events:none;
}
body.nav-active #gsm-arrow-close{
  display:block;
  animation:gsmArrowIn .22s ease-out both;
}
#gsm-arrow-close:hover{
  filter:brightness(1.08);
  box-shadow:0 10px 24px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.38);
}
#gsm-arrow-close:active{
  transform:translateY(-50%) scale(.90);
  box-shadow:0 4px 12px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.25);
}
@keyframes gsmArrowIn{
  from{opacity:0;transform:translateY(-50%) scale(.72);}
  to{opacity:1;transform:translateY(-50%) scale(1);}
}
@media (max-width:767px){
  #gsm-arrow-close{right:30px;}
}
/* Desktop/computer mode ONLY — button sits just outside drawer, left edge
   barely touches the 300px right border. Mobile CSS untouched. */
@media (min-width:768px) and (max-width:980px){
  #gsm-arrow-close{
    right:auto!important;
    left:297px!important;
    top:calc(50% - 655px)!important;
    top:calc(50dvh - 655px)!important;
    transform:translateY(-50%)!important;
  }
  #gsm-arrow-close:active{
    transform:translateY(-50%) scale(.90)!important;
  }
  body.nav-active #gsm-arrow-close{
    display:block!important;
    animation:gsmArrowInDesk .22s ease-out both;
  }
}
/* Original/real computer version (genuine desktop width) — kept separate
   from the mobile-emulated desktop-mode block above. */
@media (min-width:981px){
  #gsm-arrow-close{
    right:auto!important;
    left:297px!important;
    top:calc(50% - 58px)!important;
    top:calc(50dvh - 58px)!important;
    transform:translateY(-50%)!important;
  }
  #gsm-arrow-close:active{
    transform:translateY(-50%) scale(.90)!important;
  }
  body.nav-active #gsm-arrow-close{
    display:block!important;
    animation:gsmArrowInDesk .22s ease-out both;
  }
}
@keyframes gsmArrowInDesk{
  from{opacity:0;transform:translateY(-50%) scale(.72);}
  to{opacity:1;transform:translateY(-50%) scale(1);}
}



/* Show hamburger / 3-dot toggle on large screens too */
.slide-menu-toggle{
  display:block!important;
  position:absolute!important;
  top:0!important;
  left:0!important;
  width:48px!important;
  height:70px!important;
  line-height:70px!important;
  z-index:30!important;
  cursor:pointer!important;
  color:inherit!important;
}
/* Keep logo from overlapping the toggle on desktop header */
@media (min-width:981px){
  #header-wrap .header-logo,
  #header-wrap .main-logo{
    margin-left:48px!important;
  }
  /* Side drawer available on laptop/desktop */
  .mobile-side-menu{
    display:block!important;
  }
  .mobile-menu-wrap{
    display:block!important;
  }
  .overlay{
    display:block!important;
  }
  body.nav-active .overlay{
    visibility:visible!important;
    opacity:1!important;
  }
  /* Drawer width stays 300px — content area remains full desktop layout */
  .mobile-side-menu{
    width:300px!important;
  }
}



/* GSM VIEW — ONLY Normal/Dark controls + dark-mode overrides */
#gsm-mode-controls{
  background:transparent!important;
  position:relative!important;
  top:auto!important;
  right:auto!important;
  z-index:99999!important;
  clear:both!important;
  float:left!important;
  width:100%!important;
  height:88px!important;
  box-sizing:border-box!important;
  display:flex!important;
  gap:14px!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:12px!important;
}
#gsm-mode-controls button{
  appearance:none!important;
  -webkit-appearance:none!important;
  -webkit-tap-highlight-color:transparent!important;
  tap-highlight-color:transparent!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(128,128,128,.24)!important;
  border-radius:50%!important;
  font:normal 14px/34px Arial,sans-serif!important;
  text-align:center!important;
  cursor:pointer!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-shadow:0 3px 12px rgba(0,0,0,.12)!important;
  transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease!important;
}
#gsm-mode-controls button i,
#gsm-mode-controls button svg.gsm-mode-icon{display:block!important;line-height:1!important;width:16px!important;height:16px!important;flex-shrink:0!important}
#gsm-normal-mode{background:#fff!important;color:#f59e0b!important}
#gsm-dark-mode{background:#202124!important;color:#f8fafc!important}
#gsm-mode-controls button:hover{transform:translateY(-1px)!important;box-shadow:0 5px 14px rgba(0,0,0,.18)!important}
#gsm-mode-controls button:active{transform:scale(.94)!important}
#gsm-mode-controls + .slide-menu-flex{height:calc(100% - 147px)!important}

/* GSM VIEW: move only the 3-dot menu controls/content upward by 20px.
   The blue external arrow button and all other page elements are untouched. */
#gsm-mode-controls,
#gsm-compare-launcher,
#gsm-mode-controls + #gsm-compare-launcher + .slide-menu-flex{
  position:relative!important;
  top:-20px!important;
}

/* Full-page dark mode */
html.gsmview-dark,
html.gsmview-dark body{background:#0f1115!important;color:#f2f4f7!important}

html.gsmview-dark body,
html.gsmview-dark body #outer-wrapper,
html.gsmview-dark body #content-wrapper,
html.gsmview-dark body #main-wrapper,
html.gsmview-dark body #sidebar-wrapper,
html.gsmview-dark body #footer-wrapper,
html.gsmview-dark body #sub-footer-wrapper,
html.gsmview-dark body #mobile-menu-wrap,
html.gsmview-dark body .mobile-side-menu,
html.gsmview-dark body .slide-menu-flex,
html.gsmview-dark body .mobile-menu,
html.gsmview-dark body .mobile-menu-wrap,
html.gsmview-dark body .mm-footer,
html.gsmview-dark body .blog-posts,
html.gsmview-dark body .post,
html.gsmview-dark body .index-post,
html.gsmview-dark body .index-post .post-info,
html.gsmview-dark body .item-post,
html.gsmview-dark body .post-body,
html.gsmview-dark body .post-header,
html.gsmview-dark body .post-footer,
html.gsmview-dark body .post-snippet,
html.gsmview-dark body .widget,
html.gsmview-dark body .widget-content,
html.gsmview-dark body .footer,
html.gsmview-dark body .copyright-area{
  background-color:#0f1115!important;
  color:#f2f4f7!important;
}
/* Header / top strip = same flat page black (no raised #181b21 layer) */
html.gsmview-dark body #header-wrap,
html.gsmview-dark body #header-inner,
html.gsmview-dark body #header-wrap > .container,
html.gsmview-dark body #header-wrap .container.row{
  background-color:#0f1115!important;
  background:#0f1115!important;
  color:#f2f4f7!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  border:0!important;
}
html.gsmview-dark body .index-post .post-content,
html.gsmview-dark body .index-post .post-info,
html.gsmview-dark body .index-post .post-snippet{
  background-color:#0f1115!important;
  color:#f2f4f7!important;
}

html.gsmview-dark body *,
html.gsmview-dark body *:before,
html.gsmview-dark body *:after{
  border-color:#2d323b!important;
}

html.gsmview-dark body h1,
html.gsmview-dark body h2,
html.gsmview-dark body h3,
html.gsmview-dark body h4,
html.gsmview-dark body h5,
html.gsmview-dark body h6,
html.gsmview-dark body p,
html.gsmview-dark body span,
html.gsmview-dark body li,
html.gsmview-dark body label,
html.gsmview-dark body strong,
html.gsmview-dark body em,
html.gsmview-dark body small,
html.gsmview-dark body .post-title,
html.gsmview-dark body .post-title a,
html.gsmview-dark body .entry-title,
html.gsmview-dark body .entry-title a,
html.gsmview-dark body .widget-title,
html.gsmview-dark body .post-snippet,
html.gsmview-dark body .post-body,
html.gsmview-dark body .footer,
html.gsmview-dark body .copyright-area{
  color:#f2f4f7!important;
}

html.gsmview-dark body a{color:#f2f4f7!important}

html.gsmview-dark body input,
html.gsmview-dark body textarea,
html.gsmview-dark body select,
html.gsmview-dark body .search-form,
html.gsmview-dark body .search-input{
  background-color:#181b21!important;
  color:#fff!important;
  border-color:#343a46!important;
}
/* 3-dot menu search: drawer black fill + Compare-matched border (no shadow) */
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form{
  background-color:#181b21!important;
  background:#181b21!important;
  border:1px solid #343a46!important;
  box-shadow:none!important;
}
html.gsmview-dark body .mobile-side-menu .mobile-search .search-input{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
html.gsmview-dark body input::placeholder,
html.gsmview-dark body textarea::placeholder,
html.gsmview-dark body .search-input::placeholder{color:#b9bec8!important}

html.gsmview-dark body .slide-menu-header{
  background-color:#0f1115!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
html.gsmview-dark body .overlay{background-color:rgba(0,0,0,.68)!important}
html.gsmview-dark #gsm-normal-mode{background:#fff!important;color:#202124!important}
html.gsmview-dark #gsm-dark-mode{background:#204ecf!important;color:#fff!important}

/* GSM VIEW: keep ONLY the folder chevron visible in dark mode.
   Nothing else in the menu is changed here. */
html.gsmview-dark body .mobile-menu ul li.has-sub > .submenu-toggle,
html.gsmview-dark body .mobile-menu ul li.has-sub > .submenu-toggle:after{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}



/* NORMAL MODE — keep the existing search-result message visible. */
html:not(.gsmview-dark) body .queryMessage{
  background:#f2f2f2!important;
  color:#202124!important;
  -webkit-text-fill-color:#202124!important;
}
html:not(.gsmview-dark) body .queryMessage *{
  color:#202124!important;
  -webkit-text-fill-color:#202124!important;
}
html:not(.gsmview-dark) body .queryMessage a.show-more{
  color:#204ecf!important;
  -webkit-text-fill-color:#204ecf!important;
}

/* NIGHT MODE — make the SAME search-result message dark and readable.
   No content, size, spacing, position, cards, images or search logic are changed. */
html.gsmview-dark body .queryMessage{
  background:#181b21!important;
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
}
html.gsmview-dark body .queryMessage *{
  background:transparent!important;
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
}
html.gsmview-dark body .queryMessage a.show-more{
  color:#6ea8ff!important;
  -webkit-text-fill-color:#6ea8ff!important;
}



html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
  background:#181b21!important;
  color:#f2f4f7!important;
  border-color:#2d323b!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info .post-title,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info .post-title a{
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-meta,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-snippet,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .jump-link{
  color:#cbd1da!important;
}



html.gsmview-dark body #gsm-arrow-close::before{
  border-left:3px solid #fff!important;
  border-bottom:3px solid #fff!important;
}



html.gsmview-dark #gsm-compare-overlay .gsm-compare-slot-title{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}



#LinkList78,#LinkList79{display:none!important;}



/* FINAL: only the blue section buttons are visible; stray plain headings are hidden. */
#gsm-latest-section .gsm-extra-title h3.gsm-section-button,
#gsm-upcoming-section .gsm-extra-title h3.gsm-section-button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  height:31px!important;
  margin:0!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:5px!important;
  background:#2563eb!important;
  color:#fff!important;
  font-size:13px!important;
  line-height:31px!important;
  font-weight:700!important;
  text-transform:none!important;
  box-sizing:border-box!important;
}
#LinkList78 > .widget-title,#LinkList79 > .widget-title{display:none!important;}



#gsm-latest-section .gsm-extra-title h3.gsm-section-button,
#gsm-upcoming-section .gsm-extra-title h3.gsm-section-button{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:auto!important;min-width:0!important;height:31px!important;margin:0!important;
  padding:0 14px!important;border:0!important;border-radius:5px!important;
  background:#2563eb!important;color:#fff!important;font-size:13px!important;
  line-height:31px!important;font-weight:700!important;text-transform:none!important;
  box-sizing:border-box!important;
}
#LinkList78 > .widget-title,#LinkList79 > .widget-title{display:none!important;}



/* Exact frame properties copied from .gsm-extra-card.
   Padding is intentionally excluded so the existing image dimensions do not change. */
#Blog1 .index-post-wrap > .blog-post .post-image-wrap{
  min-width:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  border:1px solid #edf0f4 !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:0 1px 5px rgba(0,0,0,.08) !important;
}
/* Do not alter image size, crop, fit, or position. */
#Blog1 .index-post-wrap > .blog-post .post-image-wrap .post-thumb{
  width:100% !important;
  height:100% !important;
}



#Blog1 .index-post-wrap > .blog-post .index-post{
  position:relative !important;
  box-sizing:border-box !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:0 0 0 1px #edf0f4, 0 1px 5px rgba(0,0,0,.08) !important;
  overflow:hidden !important;
}
#Blog1 .index-post-wrap > .blog-post .post-image-wrap{
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
#Blog1 .index-post-wrap > .blog-post .post-info{
  position:relative !important;
  z-index:1 !important;
  background:#fff !important;
}
#Blog1 .index-post-wrap > .blog-post .post-info .post-title,
#Blog1 .index-post-wrap > .blog-post .post-info .gsm-post-actions{
  position:relative !important;
  z-index:2 !important;
}



/* FINAL MAIN POST CARD — remove white strip under image and match the requested mobile layout */
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
  width:100%!important;
  box-sizing:border-box!important;
  padding:10px!important;
  margin:0 0 12px!important;
  background:#fff!important;
  border:1px solid #edf0f4!important;
  border-radius:8px!important;
  box-shadow:0 1px 5px rgba(0,0,0,.08)!important;
  overflow:hidden!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap{
  float:none!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:3 / 4!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:3px!important;
  overflow:hidden!important;
  background:#fff!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-link{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-thumb{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  object-fit:cover!important;
  object-position:center!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
  float:none!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding:9px 0 0!important;
  margin:0!important;
  background:#fff!important;
  overflow:visible!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info .post-title{
  margin:0!important;
  padding:0!important;
  line-height:1.25!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info .post-title a{
  display:block!important;
  margin:0!important;
  padding:0!important;
}
#Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .gsm-post-actions{
  display:flex!important;
  width:100%!important;
  margin:10px 0 0!important;
  padding:0!important;
}
@media screen and (max-width:680px){
  #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
    padding:7px!important;
    margin-bottom:0!important;
  }
  #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap{
    aspect-ratio:3 / 4!important;
  }
  #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
    padding-top:7px!important;
  }
  #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .gsm-post-actions{
    margin-top:7px!important;
  }
}



/* FINAL V7: Main homepage cards use the same full mobile screen width
   available to the Latest/Upcoming two-column grids. Latest/Upcoming
   themselves are NOT modified. */
@media screen and (max-width:680px){
  body.home #content-wrapper{
    width:100vw !important;
    max-width:none !important;
    margin-top:-40px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
  body.home #content-wrapper > .container{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
  body.home #main-wrapper{
    width:100% !important;
    max-width:none !important;
    float:none !important;
    padding:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
  body.home #Blog1 .index-post-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    box-sizing:border-box !important;
  }
  body.home #Blog1 .index-post-wrap > .blog-post{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }
  body.home #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
    width:100% !important;
    margin:0 0 10px !important;
    box-sizing:border-box !important;
  }
}



/* NORMAL + NIGHT MODE — visual treatment only.
   Image dimensions, image URLs, posts and section data are untouched. */

/* Explicit normal mode: keep the clean light cards. */
html:not(.gsmview-dark) .gsm-extra-card{
  background:#fff!important;
  border-color:#edf0f4!important;
  box-shadow:0 1px 5px rgba(0,0,0,.08)!important;
}
html:not(.gsmview-dark) .gsm-extra-card .gsm-extra-image{
  background:#fff!important;
}
html:not(.gsmview-dark) .gsm-extra-card .gsm-extra-name{
  color:#111827!important;
}
html:not(.gsmview-dark) .gsm-extra-card .gsm-extra-date{
  color:#6b7280!important;
}

/* NIGHT MODE: dark card surfaces so text/images remain readable. */
html.gsmview-dark .gsm-extra-section{
  background:transparent!important;
}
html.gsmview-dark .gsm-extra-card{
  background:#171a21!important;
  border-color:#303641!important;
  box-shadow:0 2px 10px rgba(0,0,0,.34)!important;
}
html.gsmview-dark .gsm-extra-card .gsm-extra-image{
  background:#0f1115!important;
}
html.gsmview-dark .gsm-extra-card .gsm-extra-name,
html.gsmview-dark .gsm-extra-card .gsm-extra-name:visited{
  color:#f5f7fa!important;
  -webkit-text-fill-color:#f5f7fa!important;
}
html.gsmview-dark .gsm-extra-card .gsm-extra-date{
  color:#b9c0cb!important;
  -webkit-text-fill-color:#b9c0cb!important;
}
html.gsmview-dark .gsm-extra-card .gsm-post-actions .gsm-price-button,
html.gsmview-dark .gsm-extra-card .gsm-post-actions .gsm-compare-button{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
html.gsmview-dark #gsm-latest-section .gsm-extra-title h3.gsm-section-button,
html.gsmview-dark #gsm-upcoming-section .gsm-extra-title h3.gsm-section-button{
  background:#2563eb!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* Keep the existing image sizing exactly as-is. */
html.gsmview-dark .gsm-extra-card .gsm-extra-image img,
html:not(.gsmview-dark) .gsm-extra-card .gsm-extra-image img{
  width:100%;
  max-width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}



/* Pagination pages: use the exact same card/grid context as the homepage.
   No new image dimensions are introduced; the existing homepage image sizing
   remains the source of truth. */
@media screen and (min-width:681px){
  body.index:not(.home) #main-wrapper{
    width:100% !important;
    max-width:none !important;
    float:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  body.index:not(.home) #sidebar-wrapper{display:none !important;}
  body.index:not(.home) #Blog1 .index-post-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    box-sizing:border-box !important;
  }
  body.index:not(.home) #Blog1 .index-post-wrap > .blog-post{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }
  body.index:not(.home) #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
}
@media screen and (max-width:680px){
  body.index:not(.home) #Blog1 .index-post-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    box-sizing:border-box !important;
  }
  body.index:not(.home) #Blog1 .index-post-wrap > .blog-post{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }
  body.index:not(.home) #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
}



/* Hide Affiliate Price Manager on the public page BEFORE first paint.
   The Blogger widget/section itself remains intact and editable in Layout. */
#gsm-affiliate-layout-manager{display:none !important;}



/* FINAL: Compare Specifications search bar — explicit colors for both modes.
   Normal mode matches the site's light search styling; dark mode uses the site's
   dark input surface. Only the compare picker search field is affected. */

/* Normal / Light mode */
html:not(.gsmview-dark) #gsm-compare-overlay #gsm-picker-search input{
  background:#fff!important;
  color:#202124!important;
  border:1px solid #cfd4dc!important;
  -webkit-text-fill-color:#202124!important;
  caret-color:#202124!important;
  box-shadow:none!important;
}
html:not(.gsmview-dark) #gsm-compare-overlay #gsm-picker-search input::placeholder{
  color:#202124!important;
  -webkit-text-fill-color:#202124!important;
  opacity:.65!important;
}

/* Dark / Night mode */
html.gsmview-dark #gsm-compare-overlay #gsm-picker-search input{
  background:#181b21!important;
  color:#fff!important;
  border:1px solid #343a46!important;
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  box-shadow:none!important;
}
html.gsmview-dark #gsm-compare-overlay #gsm-picker-search input::placeholder{
  color:#b9bec8!important;
  -webkit-text-fill-color:#b9bec8!important;
  opacity:1!important;
}

/* Keep the same readable focus state in both modes */
html:not(.gsmview-dark) #gsm-compare-overlay #gsm-picker-search input:focus{
  background:#fff!important;
  color:#202124!important;
  border-color:#b8bec8!important;
  outline:none!important;
}
html.gsmview-dark #gsm-compare-overlay #gsm-picker-search input:focus{
  background:#181b21!important;
  color:#fff!important;
  border-color:#4a5362!important;
  outline:none!important;
}



/* Dark mode: 3-dot menu search bar — dark surface, light text, zero shadow */
html.gsmview-dark .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark .mobile-side-menu .mobile-search .search-form:focus-within{
  background-color:#181b21!important;
  background-image:none!important;
  border:1px solid #343a46!important;
  border-radius:8px!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  outline:none!important;
  overflow:hidden!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:focus{
  background:transparent!important;
  background-color:transparent!important;
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  outline:none!important;
  caret-color:#f2f4f7!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input::placeholder{
  color:#9aa0a6!important;
  -webkit-text-fill-color:#9aa0a6!important;
  opacity:1!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-action,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:before,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:hover,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:focus{
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:none!important;
  opacity:1!important;
}
/* No outer glow / shadow around the search row in the drawer header */
html.gsmview-dark .mobile-side-menu .mobile-search,
html.gsmview-dark .mobile-side-menu .slide-menu-header{
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
}



/* DARK MODE ONLY — Main Page search bar: exact requested geometry.
   Width 508px, height 54px, 1px solid border, radius 27px.
   Only #nav-search is changed. The 3-dot/mobile search is untouched. */
@media screen and (max-width:980px){
  html.gsmview-dark #nav-search{
    box-sizing:border-box!important;
    top:10px!important;
    width:100%!important;
    height:54px!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  html.gsmview-dark #nav-search .search-form{
    width:508px!important;
    max-width:calc(100vw - 32px)!important;
    height:54px!important;
    line-height:54px!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:hidden!important;
    background:#181b21!important;
    border:1px solid #343a46!important;
    border-radius:27px!important;
    box-sizing:border-box!important;
    box-shadow:none!important;
  }
  html.gsmview-dark #nav-search .search-input{
    width:100%!important;
    height:52px!important;
    line-height:52px!important;
    padding:0 64px 0 24px!important;
    margin:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:26px!important;
    box-sizing:border-box!important;
  }
  html.gsmview-dark #nav-search .hide-search{
    right:0!important;
    top:0!important;
    width:54px!important;
    height:52px!important;
    line-height:52px!important;
  }
}



@media screen and (max-width:980px){
  /* Keep the exact existing 508x54 / 27px shape untouched. */
  /* Surrounding area matches Compare Specifications panel/search surface */
  html.gsmview-dark #header-wrap{
    background:#0f1115!important;
    box-shadow:none!important;
  }
  html:not(.gsmview-dark) #header-wrap{
    background:#e8f0fe!important;
  }
  html:not(.gsmview-dark) #header-inner{
    background:#e8f0fe!important;
  }
  /* NORMAL MODE — same exact 508x54 capsule and position; only theme colors differ. */
  html:not(.gsmview-dark) #nav-search .search-form{
    background:#fff!important;
    background-color:#fff!important;
}

html:not(.gsmview-dark) #nav-search{
    top:10px!important;
    width:100%!important;
    height:54px!important;
    box-sizing:border-box!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  html:not(.gsmview-dark) #nav-search .search-form{
    width:508px!important;
    max-width:calc(100vw - 32px)!important;
    height:54px!important;
    line-height:54px!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:hidden!important;
    background:#ffffff!important;
    border:1px solid #cfd4dc!important;
    border-radius:27px!important;
    box-sizing:border-box!important;
    box-shadow:none!important;
  }
  html:not(.gsmview-dark) #nav-search .search-input{
    width:100%!important;
    height:52px!important;
    line-height:52px!important;
    padding:0 64px 0 24px!important;
    margin:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:26px!important;
    box-sizing:border-box!important;
  }
  html:not(.gsmview-dark) #nav-search .hide-search{
    right:0!important;
    top:0!important;
    width:54px!important;
    height:52px!important;
    line-height:52px!important;
  }
}



@media screen and (max-width:980px){
  /* Match Compare Specifications / 3-dot search border colors */
  html.gsmview-dark #nav-search .search-form{border:1px solid #343a46!important;}
  html:not(.gsmview-dark) #nav-search .search-form{border:1px solid #cfd4dc!important;}
}



@media screen and (max-width:980px){
  #header-wrap,
  #header-wrap > .container,
  #header-wrap .container.row{
    overflow:visible!important;
  }

  #header-wrap #nav-search{
    position:absolute!important;
    left:50%!important;
    top:8px!important;
    transform:translateX(-50%)!important;
    width:508px!important;
    max-width:calc(100vw - 32px)!important;
    height:54px!important;
    z-index:10000!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    border:0!important;
    border-radius:27px!important;
    background:transparent!important;
    overflow:visible!important;
  }

  #header-wrap #nav-search .search-form{
    width:100%!important;
    height:54px!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    border-radius:27px!important;
    line-height:54px!important;
  }

  html.gsmview-dark #header-wrap #nav-search .search-form{
    background:#181b21!important;
    border:1px solid #343a46!important;
    box-shadow:none!important;
  }
  html:not(.gsmview-dark) #header-wrap #nav-search .search-form{
    background:#fff!important;
    border:1px solid #cfd4dc!important;
  }

  #header-wrap #nav-search .search-input{
    width:100%!important;
    height:52px!important;
    line-height:52px!important;
    margin:0!important;
    padding:0 64px 0 24px!important;
    box-sizing:border-box!important;
    border:0!important;
    border-radius:26px!important;
    background:transparent!important;
  }

  #header-wrap #nav-search .hide-search{
    position:absolute!important;
    right:0!important;
    top:0!important;
    width:54px!important;
    height:52px!important;
    line-height:52px!important;
    z-index:2!important;
  }
}



@media screen and (max-width:980px){
  /* Same fill + border as Compare Specifications dark search; no black shadow */
  html.gsmview-dark #header-wrap #nav-search .search-form{
    background:#181b21!important;
    border:1px solid #343a46!important;
    box-shadow:none!important;
  }
  html.gsmview-dark #header-wrap,
  html.gsmview-dark #header-wrap > .container,
  html.gsmview-dark #header-inner{
    background:#0f1115!important;
    box-shadow:none!important;
  }
}



@media screen and (max-width:980px){
  /* Match Compare Specifications dark surface (#181b21) around main search */
  html.gsmview-dark body #header-wrap,
  html.gsmview-dark body #header-wrap > .container,
  html.gsmview-dark body #header-wrap .container.row,
  html.gsmview-dark body #header-inner{
    background:#0f1115!important;
    background-color:#0f1115!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
  }
}



@media screen and (min-width:981px){
  /* ONLY original laptop/computer. Phone and phone Desktop/Computer Mode untouched. */
  #nav-search .hide-search{
    top:0!important;
    right:0!important;
    width:58px!important;
    height:54px!important;
    line-height:54px!important;
    position:absolute!important;
  }
  #nav-search .hide-search:before,
  #nav-search .hide-search:after{
    top:50%!important;
    margin-top:-0.75px!important;
  }
}



@media screen and (min-width:981px){
  #nav-search{
    top:8px!important;
  }
}



@media screen and (min-width:981px){
  #header-wrap #nav-search .hide-search{
    position:absolute!important;
    top:0!important;
    right:0!important;
    width:54px!important;
    height:54px!important;
    margin:0!important;
    padding:0!important;
    line-height:54px!important;
    box-sizing:border-box!important;
  }
  #header-wrap #nav-search .hide-search:before,
  #header-wrap #nav-search .hide-search:after{
    top:50%!important;
    left:50%!important;
    margin-top:-0.75px!important;
    margin-left:-7px!important;
  }
}



@media screen and (min-width:981px){
  /* Dark mode is untouched. Only Normal mode changes from white to a dark
     high-contrast icon color so the existing social icons remain visible. */
  html:not(.gsmview-dark) .top-bar-social ul > li > a,
  html:not(.gsmview-dark) .top-bar-social ul > li > a:before,
  html:not(.gsmview-dark) .top-bar-social .social a,
  html:not(.gsmview-dark) .top-bar-social .social a:before{
    color:#202124!important;
  }

  html:not(.gsmview-dark) .top-bar-social ul > li:hover > a,
  html:not(.gsmview-dark) .top-bar-social ul > li:hover > a:before{
    color:$(main.color)!important;
  }
}



        .header-widget {
          background-position: <data:blog.locale.languageAlignment/>;
          background-repeat: no-repeat;
        }
      


    #gsm-browse-categories{width:100%;box-sizing:border-box;margin:0;padding:0}
    #gsm-browse-categories .gsm-browse-scroll{display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;padding:0 1px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
    #gsm-browse-categories .gsm-browse-scroll::-webkit-scrollbar{display:none}
    #gsm-browse-categories .gsm-category-btn{flex:0 0 auto;border:1px solid #d5d9e0;border-radius:14px;padding:9px 13px;background:#f3f5f8;color:#08102b!important;-webkit-text-fill-color:#08102b!important;font:500 13px inherit;line-height:1;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .15s ease}
    #gsm-browse-categories .gsm-category-btn:hover{background:#e9edf3;border-color:#c5cad4}
    #gsm-browse-categories .gsm-category-panel{margin:8px 0 0;border:1px solid #d5d9e0;border-radius:12px;overflow:hidden;background:#f7f8fa;color:#08102b}
    #gsm-browse-categories .gsm-category-panel-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #d5d9e0;color:#08102b!important;-webkit-text-fill-color:#08102b!important}
    #gsm-browse-categories .gsm-category-close{border:0;background:transparent;color:#08102b!important;-webkit-text-fill-color:#08102b!important;font-size:22px;line-height:1;cursor:pointer;padding:0 2px}
    #gsm-browse-categories .gsm-category-back{border:0;background:transparent;color:#08102b!important;-webkit-text-fill-color:#08102b!important;font-size:28px;line-height:1;cursor:pointer;padding:0 2px}
    #gsm-browse-categories .gsm-category-panel-list{display:flex;flex-direction:column}
    #gsm-browse-categories .gsm-category-child{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;text-decoration:none;color:#08102b!important;-webkit-text-fill-color:#08102b!important;background:#f7f8fa;border-bottom:1px solid #d5d9e0;font-size:13px}
    #gsm-browse-categories .gsm-category-child:last-child{border-bottom:0}
    #gsm-browse-categories .gsm-category-child:hover{background:#eef1f5}
    #gsm-browse-categories .gsm-category-btn:active{transform:scale(.97)}
    html.gsmview-dark #gsm-browse-categories .gsm-category-btn{background:#181b21;border-color:#343a46;color:#f2f4f7!important;-webkit-text-fill-color:#f2f4f7!important}
    html.gsmview-dark #gsm-browse-categories .gsm-category-btn:hover{background:#242a33;border-color:#454d5a}
    html.gsmview-dark #gsm-browse-categories .gsm-category-panel{background:#181b21;border-color:#343a46;color:#f2f4f7}
    html.gsmview-dark #gsm-browse-categories .gsm-category-panel-head,html.gsmview-dark #gsm-browse-categories .gsm-category-close,html.gsmview-dark #gsm-browse-categories .gsm-category-back{color:#f2f4f7!important;-webkit-text-fill-color:#f2f4f7!important}
    html.gsmview-dark #gsm-browse-categories .gsm-category-child{background:#181b21;border-color:#343a46;color:#f2f4f7!important;-webkit-text-fill-color:#f2f4f7!important}
    html.gsmview-dark #gsm-browse-categories .gsm-category-child:hover{background:#242a33}
    @media screen and (max-width:680px){#gsm-browse-categories{margin:0;padding:0}.gsm-category-btn{padding:9px 12px!important}}
  


  @media screen and (min-width:981px){
    #content-wrapper > .container > #gsm-browse-categories,
    #gsm-browse-categories{
      display:block!important;
      visibility:visible!important;
      opacity:1!important;
      height:auto!important;
      max-height:none!important;
      overflow:visible!important;
      float:none!important;
      clear:both!important;
      margin:0 0 14px!important;
      padding:0!important;
    }
    #gsm-browse-categories .gsm-browse-scroll{
      display:flex!important;
      visibility:visible!important;
      opacity:1!important;
      flex-wrap:nowrap!important;
    }
    #gsm-browse-categories .gsm-category-btn{
      display:inline-flex!important;
      align-items:center!important;
      gap:6px!important;
    }
  }
  


  @media screen and (min-width:981px){
    body.home .author-intro-widgets{
      display:none!important;
      margin:0!important;
      padding:0!important;
      height:0!important;
    }
    body.home #content-wrapper{
      margin-top:-160px!important;
    }
    /* The thin line was .header-menu's bottom divider border, which used
       to be hidden by the empty space above. Remove just that border on
       original laptop/computer only — phone keeps its border unchanged. */
    .header-menu{
      border-bottom:0!important;
      box-shadow:none!important;
    }
    /* Remove the 5 social media icons row on original laptop/computer only. */
    #top-bar-social,
    .top-bar-social{
      display:none!important;
    }
  }
  


    #gsm-browse-categories .gsm-browse-arrow{display:none}
    @media screen and (min-width:981px){
      #gsm-browse-categories{position:relative!important}
      #gsm-browse-categories .gsm-browse-scroll{
        scroll-behavior:smooth!important;
        padding-left:34px!important;
        padding-right:34px!important;
      }
      #gsm-browse-categories .gsm-browse-arrow{
        display:flex!important;
        align-items:center;
        justify-content:center;
        position:absolute;
        top:2px;
        width:28px;
        height:28px;
        z-index:5;
        border:1px solid #d5d9e0;
        border-radius:50%;
        background:#fff;
        color:#08102b;
        font-size:18px;
        line-height:1;
        cursor:pointer;
        box-shadow:0 1px 4px rgba(0,0,0,.12);
        transition:background .2s ease,opacity .2s ease;
      }
      #gsm-browse-categories .gsm-browse-arrow:hover{background:#e9edf3}
      #gsm-browse-categories .gsm-browse-arrow-left{left:0}
      #gsm-browse-categories .gsm-browse-arrow-right{right:0}
      html.gsmview-dark #gsm-browse-categories .gsm-browse-arrow{background:#181b21;border-color:#343a46;color:#f2f4f7}
      html.gsmview-dark #gsm-browse-categories .gsm-browse-arrow:hover{background:#242a33}
    }
  


    @media screen and (min-width:981px) and (hover:none) and (pointer:coarse){
      #gsm-browse-categories .gsm-category-btn,
      #gsm-browse-categories .gsm-browse-arrow,
      #gsm-browse-categories .gsm-category-child{
        -webkit-tap-highlight-color:transparent!important;
        outline:none!important;
        -webkit-user-select:none;
        user-select:none;
      }
      #gsm-browse-categories .gsm-category-btn:focus,
      #gsm-browse-categories .gsm-browse-arrow:focus,
      #gsm-browse-categories .gsm-category-child:focus,
      #gsm-browse-categories .gsm-category-btn:active,
      #gsm-browse-categories .gsm-browse-arrow:active,
      #gsm-browse-categories .gsm-category-child:active{
        outline:none!important;
        box-shadow:none!important;
        -webkit-box-shadow:none!important;
      }
    }
  


    .post-body a.b-tooltip-container {
      position: relative;
      display: inline-block;
    }

    .post-body a.b-tooltip-container .b-tooltip {
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translate(-20%, 1px);
      visibility: hidden;
      opacity: 0;
      z-index: 1;
      transition: opacity 0.2s ease-in-out;
    }

    .post-body a.b-tooltip-container .b-tooltip iframe {
      width: 200px;
      height: 198px;
      max-width: none;
      border: none;
      border-radius: 20px;
      box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
    }

    .post-body a.b-tooltip-container:hover .b-tooltip {
      visibility: visible;
      opacity: 1;
    }
  


.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



.sora-ads-side {
  display: block;
    background-color: #eee;
    text-align: center;
    font-size: 13px;
    color: #aaaaaa;
    font-weight: 400;
    font-style: italic;
    line-height: 250px;
    border: 1px solid #ccc;
}


.theiaStickySidebar:after {content: ""; display: table; clear: both;}


.header-menu, .mobile-header {
transition: 0.5s ease all;
}
.header-menu.scrolled-header, .mobile-header.scrolled-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
    -webkit-animation: slide-down 0.2s;
    -moz-animation: slide-down 0.2s;
    animation: slide-down 0.2s;
  z-index:9;
}
@-webkit-keyframes slide-down { 0% { opacity:0; transform:translateY(-100%);}100% { opacity:0.9; transform:translateY(0);}}

@-moz-keyframes slide-down { 0% { opacity:0; transform:translateY(-100%);}100% { opacity:0.9; transform:translateY(0);}}

@keyframes slide-down { 0% { opacity:0; transform:translateY(-100%);}100% { opacity:0.9; transform:translateY(0);}}



/* Desktop: make pagination result area match the homepage image/card width. */
@media screen and (min-width:681px){
  html.gsm-pagination-page body #main-wrapper{
    width:100% !important;
    max-width:none !important;
    float:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  html.gsm-pagination-page body #sidebar-wrapper{
    display:none !important;
  }
  html.gsm-pagination-page body #Blog1 .index-post-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    box-sizing:border-box !important;
  }
  html.gsm-pagination-page body #Blog1 .index-post-wrap > .blog-post{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
}
/* Mobile: make pagination result area use the same full-width two-column grid. */
@media screen and (max-width:680px){
  html.gsm-pagination-page body #content-wrapper{
    width:100vw !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
  html.gsm-pagination-page body #content-wrapper > .container{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }
  html.gsm-pagination-page body #main-wrapper{
    width:100% !important;
    max-width:none !important;
    float:none !important;
    padding:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
  html.gsm-pagination-page body #Blog1 .index-post-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    box-sizing:border-box !important;
  }
  html.gsm-pagination-page body #Blog1 .index-post-wrap > .blog-post{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }
}



@media screen and (max-width:680px){
  body.index:not(.home) #content-wrapper,
  html.gsm-pagination-page body #content-wrapper{
    margin-top:10px !important;
  }
}



/* Normal mode: keep the original pagination ellipsis colors. */
html:not(.gsmview-dark) #blog-pager span.page-dots,
html:not(.gsmview-dark) span.page-dots{
  background-color:#fff !important;
  color:$(title.color) !important;
  -webkit-text-fill-color:$(title.color) !important;
  border-color:transparent !important;
  box-shadow:none !important;
  text-shadow:none !important;
}

/* Dark mode: the ellipsis itself is white, with no white box. */
html.gsmview-dark #blog-pager span.page-dots,
html.gsmview-dark span.page-dots{
  background-color:#0f1115 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  border-color:transparent !important;
}


.theiaStickySidebar:after {content: ""; display: table; clear: both;}


#gsm-affiliate-layout-manager{display:none !important;}



/* GSM VIEW — Phone Compare */
#gsm-compare-launcher{display:flex;align-items:center;width:calc(100% - 40px);margin:12px 20px 10px;box-sizing:border-box;border:0;border-radius:10px;padding:12px 0;background:transparent;color:inherit;font:600 15px/1.2 Arial,sans-serif;cursor:pointer;text-align:left;box-shadow:none}
#gsm-compare-launcher .gsm-scale-emoji{display:inline-flex;width:22px;height:22px;margin-right:1px;align-items:center;justify-content:center;color:#000!important;-webkit-text-fill-color:#000!important;vertical-align:-5px;transition:transform .2s ease,filter .2s ease;} #gsm-compare-launcher .gsm-modern-scale{width:21px;height:21px;display:block;overflow:visible;} html.gsmview-dark #gsm-compare-launcher .gsm-scale-emoji{color:#fff!important;-webkit-text-fill-color:#fff!important;} #gsm-compare-launcher:hover .gsm-scale-emoji{transform:translateY(-1px) scale(1.08);filter:drop-shadow(0 2px 3px rgba(0,0,0,.18));}
#gsm-compare-launcher:hover{background:rgba(255,255,255,.06)}
#gsm-compare-launcher:active{transform:scale(.99)}
#gsm-compare-overlay{display:none;position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.68);padding:18px;box-sizing:border-box;overflow:auto}
#gsm-compare-overlay.gsm-open{display:flex;align-items:center;justify-content:center}
#gsm-compare-panel{width:min(980px,100%);max-height:94vh;overflow:auto;background:#fff;color:#202124;border-radius:16px;box-shadow:0 18px 60px rgba(0,0,0,.4);padding:18px;box-sizing:border-box}
.gsm-compare-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}
.gsm-compare-head h3{margin:0;font:700 20px/1.2 Arial,sans-serif}
#gsm-compare-close{border:0;background:#eef0f3;color:#202124;width:36px;height:36px;border-radius:50%;font-size:22px;cursor:pointer}
.gsm-compare-slots{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.gsm-compare-slot{min-height:145px;border:1px solid #d9dde3;border-radius:14px;padding:12px;box-sizing:border-box;background:#f8f9fb}
.gsm-compare-slot-title{font:700 13px/1.2 Arial,sans-serif;margin-bottom:10px;color:#5f6368}
.gsm-phone-picker{display:flex;align-items:center;justify-content:center;min-height:105px;cursor:pointer;border:2px dashed #cbd5e1;border-radius:12px;background:#fff}
.gsm-phone-picker .gsm-plus{font:300 48px/1 Arial,sans-serif;color:#2563eb}
.gsm-selected-phone{display:flex;align-items:center;gap:10px;cursor:pointer}
.gsm-selected-phone img{width:62px;height:62px;object-fit:contain;border-radius:10px;background:#fff}
.gsm-selected-phone strong{font:700 15px/1.3 Arial,sans-serif;color:#202124}
.gsm-picker-search{display:none;margin:0 0 14px}
.gsm-picker-search.gsm-show{display:block}
.gsm-picker-search input{width:100%;height:44px;border:1px solid #cfd4dc;border-radius:10px;padding:0 13px;box-sizing:border-box;font-size:15px;outline:none}
.gsm-picker-results{display:grid;gap:7px;margin-top:8px;max-height:220px;overflow:auto}
.gsm-picker-result{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid #e1e5ea;background:#fff;border-radius:10px;padding:9px;cursor:pointer}
.gsm-picker-result img{width:45px;height:45px;object-fit:contain;border-radius:7px;background:#f5f5f5}
.gsm-picker-result span{font:600 14px/1.3 Arial,sans-serif;color:#202124}
.gsm-picker-empty{padding:10px;color:#6b7280;font:14px/1.4 Arial,sans-serif}
#gsm-compare-table-wrap{margin-top:18px;display:none}
#gsm-compare-table-wrap.gsm-show{display:block}
.gsm-compare-status{font:600 14px/1.4 Arial,sans-serif;color:#5f6368;margin:8px 0}
.gsm-compare-table{width:100%;border-collapse:collapse;table-layout:fixed;font:14px/1.45 Arial,sans-serif}
.gsm-compare-table th,.gsm-compare-table td{border:1px solid #e0e3e7;padding:10px;vertical-align:top;word-break:break-word}
.gsm-compare-table th{background:#f1f3f4;font-weight:700}
.gsm-compare-table th:first-child{width:24%}
.gsm-compare-table img{max-width:120px;height:auto}
.gsm-compare-table ul,.gsm-compare-table ol{margin:6px 0;padding-left:18px}
.gsm-compare-table p{margin:0 0 6px}
.gsm-compare-table .gsm-na{color:#9aa0a6;font-style:italic}
.gsm-compare-table .gsm-na.gsm-ai-pending{position:relative;padding-left:14px}
.gsm-compare-table .gsm-na.gsm-ai-pending::before{content:'';position:absolute;left:0;top:3px;width:9px;height:9px;border:2px solid #c9cdd3;border-top-color:#7a5cff;border-radius:50%;animation:gsm-ai-spin .7s linear infinite}
.gsm-compare-table .gsm-ai-value{display:inline}
.gsm-compare-table .gsm-ai-badge{display:none!important}
.gsm-compare-table .gsm-price-line{margin:0 0 4px}
.gsm-compare-table .gsm-price-line:last-child{margin-bottom:0}
html.gsmview-dark .gsm-compare-table .gsm-na{color:#6b7280}
html.gsmview-dark .gsm-compare-table .gsm-na.gsm-ai-pending::before{border-color:#3a4150;border-top-color:#a48bff}
@keyframes gsm-ai-spin{to{transform:rotate(360deg)}}
.gsm-compare-note{margin-top:12px;color:#6b7280;font:12px/1.45 Arial,sans-serif}
@media(max-width:680px){
 #gsm-compare-overlay{padding:8px}
 #gsm-compare-panel{padding:12px;border-radius:12px}
 .gsm-compare-slots{grid-template-columns:1fr;gap:9px}
 .gsm-compare-slot{min-height:108px}
 .gsm-phone-picker{min-height:78px}
 .gsm-phone-picker .gsm-plus{font-size:40px}
 .gsm-compare-table{font-size:12px}
 .gsm-compare-table th:first-child{width:27%}
}
html.gsmview-dark #gsm-compare-panel{background:#181b21;color:#fff}
html.gsmview-dark .gsm-compare-slot{background:#11151b;border-color:#343a46}
html.gsmview-dark .gsm-phone-picker,.gsmview-dark .gsm-picker-result{background:#181b21;border-color:#343a46}
html.gsmview-dark .gsm-selected-phone strong,html.gsmview-dark .gsm-picker-result span{color:#fff}
html.gsmview-dark .gsm-picker-search input{background:#181b21;color:#fff;border-color:#343a46}
html.gsmview-dark .gsm-compare-table th{background:#242a33;color:#fff}
html.gsmview-dark .gsm-compare-table th,html.gsmview-dark .gsm-compare-table td{border-color:#343a46}



/* FINAL FIX: Compare Specifications search clear X.
   Matches the main-page search-bar X in shape, size and theme. */
#gsm-picker-search{position:relative!important;}
#gsm-picker-search input{padding-right:46px!important;}
#gsm-picker-search input::-webkit-search-cancel-button{display:none!important;-webkit-appearance:none!important;appearance:none!important;}
#gsm-picker-search .gsm-picker-clear{
  position:absolute!important;
  right:7px!important;
  top:6px!important;
  transform:none!important;
  width:32px!important;
  height:32px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-align:center!important;
  cursor:pointer!important;
  z-index:5!important;
  display:none!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
#gsm-picker-search .gsm-picker-clear.gsm-x-visible{display:block!important;}
#gsm-picker-search .gsm-picker-clear:before,
#gsm-picker-search .gsm-picker-clear:after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:14px!important;
  height:1.5px!important;
  margin-left:-7px!important;
  margin-top:-0.75px!important;
  background:#555!important;
  border-radius:2px!important;
  transform-origin:center!important;
}
#gsm-picker-search .gsm-picker-clear:before{transform:rotate(45deg)!important;}
#gsm-picker-search .gsm-picker-clear:after{transform:rotate(-45deg)!important;}
html.gsmview-dark #gsm-picker-search .gsm-picker-clear:before,
html.gsmview-dark #gsm-picker-search .gsm-picker-clear:after{background:#fff!important;}
#gsm-picker-search .gsm-picker-clear:hover:before,
#gsm-picker-search .gsm-picker-clear:hover:after{background:#555!important;}
html.gsmview-dark #gsm-picker-search .gsm-picker-clear:hover:before,
html.gsmview-dark #gsm-picker-search .gsm-picker-clear:hover:after{background:#fff!important;}



#nav-search .search-input::-webkit-search-cancel-button{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:18px!important;
  height:18px!important;
  margin-right:4px!important;
  cursor:pointer!important;
  opacity:1!important;
  filter:brightness(0) invert(1)!important;
}
.mobile-side-menu .mobile-search .search-input::-webkit-search-cancel-button{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:18px!important;
  height:18px!important;
  margin-right:2px!important;
  cursor:pointer!important;
  opacity:1!important;
  filter:brightness(0) invert(1)!important;
}



#nav-search .search-form,
.mobile-side-menu .mobile-search .search-form{
  position:relative!important;
}

/* Same X shape for both search bars; no icon font, so it cannot render as text */
#nav-search .hide-search{
  right:0!important;
  top:0!important;
  width:58px!important;
  height:70px!important;
  z-index:60!important;
  color:transparent!important;
  font-size:0!important;
  position:absolute!important;
}

#nav-search .hide-search:before,
#nav-search .hide-search:after,
.mobile-side-menu .gsm-clear-search:before,
.mobile-side-menu .gsm-clear-search:after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:14px!important;
  height:1.5px!important;
  margin-left:-7px!important;
  margin-top:-0.75px!important;
  background:#fff!important;
  border-radius:2px!important;
  transform-origin:center!important;
}

/* Normal/light mode: dark X on the light search bar */
html:not(.gsmview-dark) #nav-search .hide-search:before,
html:not(.gsmview-dark) #nav-search .hide-search:after,
html:not(.gsmview-dark) .mobile-side-menu .gsm-clear-search:before,
html:not(.gsmview-dark) .mobile-side-menu .gsm-clear-search:after{
  background:#555!important;
}

/* Dark mode: white X */
html.gsmview-dark #nav-search .hide-search:before,
html.gsmview-dark #nav-search .hide-search:after,
html.gsmview-dark .mobile-side-menu .gsm-clear-search:before,
html.gsmview-dark .mobile-side-menu .gsm-clear-search:after{
  background:#fff!important;
}

#nav-search .hide-search:before,
.mobile-side-menu .gsm-clear-search:before{
  transform:rotate(45deg)!important;
}

#nav-search .hide-search:after,
.mobile-side-menu .gsm-clear-search:after{
  transform:rotate(-45deg)!important;
}

#nav-search .hide-search:hover:before,
#nav-search .hide-search:hover:after,
.mobile-side-menu .gsm-clear-search:hover:before,
.mobile-side-menu .gsm-clear-search:hover:after{
  background:#fff!important;
}

.mobile-side-menu .gsm-clear-search{
  position:absolute!important;
  right:8px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:32px!important;
  height:32px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-align:center!important;
  cursor:pointer!important;
  z-index:70!important;
  display:none;
  -webkit-appearance:none!important;
  appearance:none!important;
}



.mobile-side-menu .mobile-search .search-form{
  position:relative!important;
}
.mobile-side-menu .mobile-search .search-action{
  display:block;
  position:relative!important;
  z-index:2!important;
}
.mobile-side-menu .mobile-search .search-action.gsm-search-hidden{
  display:none!important;
}
.mobile-side-menu .mobile-search .gsm-clear-search{
  right:8px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:5!important;
  display:none;
}
.mobile-side-menu .mobile-search .gsm-clear-search.gsm-x-visible{
  display:block!important;
}



html.gsmview-dark .mobile-side-menu .mobile-search .search-action,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:before{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}



/* DARK MODE ONLY — remove the light/white speckled frame around main post cards.
   Affiliate setup, product data, links, images and dimensions are untouched. */
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
  background:#181b21!important;
  border:1px solid #303641!important;
  box-shadow:0 2px 8px rgba(0,0,0,.35)!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap{
  background:#0f1115!important;
  border:0!important;
  box-shadow:none!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
  background:#181b21!important;
  border:0!important;
}



/* DARK MODE ONLY: remove the light background showing around the existing card frame.
   The card frame itself is intentionally unchanged. */
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .index-post{
  background:#0f1115!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post{
  background:#0f1115!important;
}



/* DARK MODE ONLY — remove the light pixels visible at the four inner
   corners of the image area. The existing card frame is untouched. */
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap .post-image-link{
  background:#0f1115!important;
  background-image:none!important;
  border:0!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap{
  background:#0f1115!important;
}



/* DARK MODE ONLY — eliminate white anti-aliased pixels at the four inner
   corners and immediately around the existing card frame. The card frame
   itself (border, radius and dimensions) is intentionally preserved. */
html.gsmview-dark body #Blog1,
html.gsmview-dark body #Blog1 .index-post-wrap,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .index-post{
  background:#0f1115!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
  background:#181b21!important;
  border-color:#303641!important;
  background-clip:padding-box!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-link,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-thumb{
  background:#0f1115!important;
  border-color:transparent!important;
  outline:0!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-image-wrap{
  background-clip:padding-box!important;
  overflow:hidden!important;
}
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card .post-info{
  background:#181b21!important;
}



.mobile-side-menu{
  overscroll-behavior-y:contain!important;
}
.mobile-side-menu .slide-menu-flex{
  overscroll-behavior-y:contain!important;
}
body.nav-active{
  overscroll-behavior-y:none!important;
}



html.gsmview-dark .mobile-side-menu .slide-menu-header,
html.gsmview-dark body .mobile-side-menu .slide-menu-header,
html.gsmview-dark .mobile-side-menu .mobile-search,
html.gsmview-dark body .mobile-side-menu .mobile-search{
  background:#0f1115!important;
  background-color:#0f1115!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  border:0!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark .mobile-side-menu .mobile-search .search-form:focus-within,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form:focus-within{
  background:#181b21!important;
  background-color:#181b21!important;
  background-image:none!important;
  border:1px solid #343a46!important;
  border-radius:8px!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  outline:0!important;
  overflow:hidden!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:focus,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:focus-visible,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-input{
  background:transparent!important;
  background-color:transparent!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input::placeholder{
  color:#b9bec8!important;
  -webkit-text-fill-color:#b9bec8!important;
  opacity:1!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill:hover,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill:focus{
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  transition:background-color 99999s ease-in-out 0s!important;
  box-shadow:0 0 0 1000px #181b21 inset!important;
  -webkit-box-shadow:0 0 0 1000px #181b21 inset!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-action,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:before,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:hover,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:focus,
html.gsmview-dark .mobile-side-menu .mobile-search .search-action:active{
  color:#f2f4f7!important;
  -webkit-text-fill-color:#f2f4f7!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  opacity:1!important;
}



#gsm-latest-upcoming,
#gsm-latest-upcoming .widget,
#gsm-latest-upcoming .widget-content,
#gsm-extra-sections,
#gsm-latest-section,
#gsm-upcoming-section,
#gsm-latest-grid,
#gsm-upcoming-grid{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  float:none!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
}
#gsm-latest-grid,
#gsm-upcoming-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
#gsm-latest-grid .gsm-extra-card,
#gsm-upcoming-grid .gsm-extra-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:7px!important;
  border:1px solid #edf0f4!important;
  border-radius:8px!important;
  background:#fff!important;
  box-shadow:0 1px 5px rgba(0,0,0,.08)!important;
  display:flex!important;
  flex-direction:column!important;
  float:none!important;
  position:relative!important;
}
#gsm-latest-grid .gsm-extra-card .gsm-extra-image,
#gsm-upcoming-grid .gsm-extra-card .gsm-extra-image{
  width:100%!important;
  height:auto!important;
  aspect-ratio:3 / 4!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  display:block!important;
}
#gsm-latest-grid .gsm-extra-card .gsm-extra-image img,
#gsm-upcoming-grid .gsm-extra-card .gsm-extra-image img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
@media screen and (max-width:680px){
  body #gsm-latest-upcoming{
    width:100%!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
  }
}
@media screen and (min-width:681px){
  #gsm-latest-upcoming{
    width:66.66666667%!important;
    max-width:66.66666667%!important;
    padding:0 15px!important;
    box-sizing:border-box!important;
  }
  #gsm-latest-grid .gsm-extra-card,
  #gsm-upcoming-grid .gsm-extra-card{padding:10px!important;}
}
html.gsmview-dark #gsm-latest-grid .gsm-extra-card,
html.gsmview-dark #gsm-upcoming-grid .gsm-extra-card{
  background:#171a21!important;
  border-color:#303641!important;
}



/* Only fix main homepage card bottom spacing to match grid gap */
@media screen and (max-width:680px){
  body.home #Blog1 .index-post-wrap > .blog-post .gsm-main-post-card{
    margin-bottom:0 !important;
  }
}



#smartAIButton{
  position:fixed;
  right:20px;
  bottom:85px;
  width:40px;
  height:40px;
  border-radius:50%;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:99998;
  touch-action:none;
}

#gsmAILogoBtn{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:contain;
  display:block;
  background:transparent;
}

#gsmAILogoHeader{
  width:26px;
  height:26px;
  border-radius:50%;
  object-fit:contain;
  vertical-align:middle;
  display:inline-block;
  background:transparent;
}

#smartAIChat{
  display:none;
  flex-direction:column;
  position:fixed;
  right:20px;
  bottom:165px;
  width:360px;
  height:min(520px,70vh);
  max-height:70vh;
  background:white;
  border-radius:25px;
  border:1px solid #cfd4dc;
  box-shadow:0 10px 40px #555;
  z-index:99998;
  overflow:hidden;
  box-sizing:border-box;
}

#smartAIChat.gsm-ai-open{
  display:flex;
}

.aiHeader{
  flex:0 0 auto;
  background:#0f172a;
  color:white;
  padding:18px;
  display:flex;
  justify-content:space-between;
}

/* GSM VIEW: ORIGINAL LAPTOP/COMPUTER ONLY — fix the broken/blown-up
   text-select (I-beam) cursor that appeared over the AI chat's ✕
   close button. Giving it a normal pointer cursor stops the browser
   from falling back to the default text cursor there.
   Scoped to desktop widths only; phone and phone-desktop-mode
   screens are untouched. */
@media screen and (min-width:981px){
  #gsmAICloseBtn{
    cursor:pointer;
    -webkit-user-select:none;
    user-select:none;
  }
}

#aiMessages{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:15px;
}

.botMsg,
.userMsg{
  padding:12px;
  margin:10px;
  border-radius:15px;
}

.botMsg{
  background:#e5e7eb;
}

.aiAdviceIcon{
  width:16px;
  height:16px;
  border-radius:50%;
  object-fit:contain;
  vertical-align:-3px;
  margin-right:2px;
  background:transparent;
}

.botMsg[id^="aiTyping"]{
  letter-spacing:2px;
  animation:aiTypingPulse 1s ease-in-out infinite;
}

@keyframes aiTypingPulse{
  0%,100%{opacity:.35;}
  50%{opacity:1;}
}

.userMsg{
  background:#2563eb;
  color:white;
}

.gsm-chat-site-link{
  display:inline-block;
  background:#2563eb;
  color:#fff !important;
  text-decoration:none;
  padding:8px 14px;
  border-radius:20px;
  font-weight:600;
  font-size:.9em;
}

.gsm-chat-site-link:hover{
  background:#1d4ed8;
}

.aiInput{
  flex:0 0 auto;
  display:flex;
  gap:5px;
  padding:10px;
}

.aiInput input{
  flex:1;
  padding:12px;
  min-width:0;
}

@media(max-width:600px){
  #smartAIChat{
    width:92vw;
    right:4vw;
    bottom:150px;
    height:min(520px,65vh);
    max-height:65vh;
  }
}

/* GSM VIEW: AI chat window border — same color as the search-bar
   border, in both Normal and Night mode. Applies to the whole
   chat panel (all four sides), on every screen size. */
html:not(.gsmview-dark) #smartAIChat{
  border:1px solid #cfd4dc!important;
}
html.gsmview-dark #smartAIChat{
  border:1px solid #343a46!important;
}

/* GSM VIEW dark mode — match the site's existing dark palette */
html.gsmview-dark #smartAIChat{
  background:#0f1115;
  border:1px solid #343a46;
  box-shadow:0 10px 40px rgba(0,0,0,.6);
}
html.gsmview-dark .aiHeader{
  background:#0b0d11;
  border-bottom:1px solid #343a46;
}
/* GSM VIEW: dark mode — the empty area of the chat page (where no
   text bubble or the search/input bar sits) is fully dark, matching
   the page background. Message bubbles and the search/input bar
   below keep their own colors, unchanged. */
html.gsmview-dark #aiMessages{
  background:#0f1115!important;
}
html.gsmview-dark .botMsg{
  background:#242a33!important;
  color:#f2f4f7;
}
html.gsmview-dark .userMsg{
  background:#2563eb;
  color:#fff;
}
html.gsmview-dark .aiInput{
  background:#181b21!important;
  border-top:1px solid #343a46;
}
html.gsmview-dark .aiInput input{
  background:#181b21;
  border:1px solid #343a46;
  color:#f2f4f7;
  border-radius:8px;
}
html.gsmview-dark .aiInput input::placeholder{
  color:#b9bec8;
}
html.gsmview-dark .aiInput button{
  background:#2563eb;
  color:#fff;
}

/* GSM VIEW: mic button pulses red while actively listening */
.aiInput button.gsm-voice-listening{
  background:#dc2626 !important;
  animation:gsmVoicePulse 1.1s infinite;
}
@keyframes gsmVoicePulse{
  0%{box-shadow:0 0 0 0 rgba(220,38,38,.55);}
  70%{box-shadow:0 0 0 12px rgba(220,38,38,0);}
  100%{box-shadow:0 0 0 0 rgba(220,38,38,0);}
}



/* Main header search (#nav-search) — match Compare / 3-dot border colors */
html:not(.gsmview-dark) #nav-search{
  border:1px solid #cfd4dc!important;
}
html.gsmview-dark #nav-search{
  border:1px solid #343a46!important;
}

/* ========== 3-DOT MOBILE SEARCH FORM BORDER ========== */
/* Match Compare Specifications search border colors exactly.
   Normal: #cfd4dc | Dark: #343a46  (Compare bar itself is NOT changed) */
html:not(.gsmview-dark) .mobile-side-menu .mobile-search .search-form,
html:not(.gsmview-dark) .mobile-side-menu .mobile-search .search-form:focus-within,
html:not(.gsmview-dark) body .mobile-side-menu .mobile-search .search-form,
html:not(.gsmview-dark) body .mobile-side-menu .mobile-search .search-form:focus-within{
  border:1px solid #cfd4dc!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  outline:0!important;
}

/* Night mode: same border as Compare Specifications dark search */
html.gsmview-dark .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark .mobile-side-menu .mobile-search .search-form:focus-within,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form:focus-within{
  border:1px solid #343a46!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  outline:0!important;
}



/* Dark mode only: 3-dot menu search bar surface + border identical to
   Compare Specifications search (#gsm-picker-search input). */
html.gsmview-dark .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark .mobile-side-menu .mobile-search .search-form:focus-within,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-form:focus-within,
html.gsmview-dark .is-dark .mobile-search .search-form,
html.gsmview-dark .is-dark .mobile-search .search-form:focus-within{
  background:#181b21!important;
  background-color:#181b21!important;
  background-image:none!important;
  border:1px solid #343a46!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  outline:0!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:focus,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:focus-visible,
html.gsmview-dark body .mobile-side-menu .mobile-search .search-input{
  background:transparent!important;
  background-color:transparent!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input::placeholder{
  color:#b9bec8!important;
  -webkit-text-fill-color:#b9bec8!important;
  opacity:1!important;
}
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill:hover,
html.gsmview-dark .mobile-side-menu .mobile-search .search-input:-webkit-autofill:focus{
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  box-shadow:0 0 0 1000px #181b21 inset!important;
  -webkit-box-shadow:0 0 0 1000px #181b21 inset!important;
}



html.gsmview-dark,
html.gsmview-dark body{
  background:#0f1115!important;
  background-color:#0f1115!important;
}
html.gsmview-dark body #outer-wrapper{
  background:#0f1115!important;
  background-color:#0f1115!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
}
html.gsmview-dark body #header-wrap,
html.gsmview-dark body #header-inner,
html.gsmview-dark body #header-wrap > .container,
html.gsmview-dark body #header-wrap .container.row,
html.gsmview-dark body #header-wrap .header-header,
html.gsmview-dark body .header-header,
html.gsmview-dark body .header-menu,
html.gsmview-dark body .mobile-header,
html.gsmview-dark body #top-bar,
html.gsmview-dark #header-wrap,
html.gsmview-dark #header-inner,
html.gsmview-dark #header-wrap > .container,
html.gsmview-dark #header-wrap .container.row{
  background:#0f1115!important;
  background-color:#0f1115!important;
  background-image:none!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  border:0!important;
  border-bottom:0!important;
  outline:0!important;
}
html.gsmview-dark body .header-menu.scrolled-header,
html.gsmview-dark body .mobile-header.scrolled-header,
html.gsmview-dark .header-menu.scrolled-header,
html.gsmview-dark .mobile-header.scrolled-header{
  background:#0f1115!important;
  background-color:#0f1115!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
}
/* Content area under header also pure flat black */
html.gsmview-dark body #content-wrapper,
html.gsmview-dark body #main-wrapper,
html.gsmview-dark body #Blog1,
html.gsmview-dark body #Blog1 .index-post-wrap,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post,
html.gsmview-dark body #Blog1 .index-post-wrap > .blog-post .index-post{
  background:#0f1115!important;
  background-color:#0f1115!important;
  box-shadow:none!important;
}
/* Search capsule keeps its own surface; surrounding header is flat */
html.gsmview-dark body #header-wrap #nav-search .search-form,
html.gsmview-dark body #nav-search .search-form,
html.gsmview-dark #header-wrap #nav-search .search-form,
html.gsmview-dark #nav-search .search-form{
  background:#181b21!important;
  background-color:#181b21!important;
  border:1px solid #343a46!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
}



/* ONLY the placeholder "Search" text color — locked identical to main page search */

/* NORMAL mode — same as main/mobile search placeholder */
html:not(.gsmview-dark) #gsm-compare-overlay #gsm-picker-search input::placeholder,
html:not(.gsmview-dark) #gsm-picker-search input::placeholder,
html:not(.gsmview-dark) #gsm-picker-input::placeholder{
  color:#202124!important;
  -webkit-text-fill-color:#202124!important;
  opacity:.65!important;
}

/* Also lock main page search placeholder to the same value so they cannot diverge */
html:not(.gsmview-dark) #nav-search .search-input::placeholder,
html:not(.gsmview-dark) #header-wrap #nav-search .search-input::placeholder{
  color:#202124!important;
  -webkit-text-fill-color:#202124!important;
  opacity:.65!important;
}

/* DARK mode — same as main page dark search placeholder */
html.gsmview-dark #gsm-compare-overlay #gsm-picker-search input::placeholder,
html.gsmview-dark #gsm-picker-search input::placeholder,
html.gsmview-dark #gsm-picker-input::placeholder{
  color:#b9bec8!important;
  -webkit-text-fill-color:#b9bec8!important;
  opacity:1!important;
}

html.gsmview-dark #nav-search .search-input::placeholder,
html.gsmview-dark #header-wrap #nav-search .search-input::placeholder{
  color:#b9bec8!important;
  -webkit-text-fill-color:#b9bec8!important;
  opacity:1!important;
}



/* ORIGINAL COMPUTER/LAPTOP ONLY. Do not affect mobile or mobile Desktop-site view. */
@media screen and (min-width:981px){
  html:not(.gsmview-dark) #nav-search .search-form{
    background:#fff!important;
    background-color:#fff!important;
  }
}



@media screen and (min-width:981px){
  /* ONLY original laptop/computer.
     Phone and phone Desktop/Computer Mode are untouched. */

  html.gsmview-dark #header-wrap #nav-search .search-form,
  html.gsmview-dark #nav-search .search-form{
    background:#181b21!important;
    background-color:#181b21!important;
    border:1px solid #343a46!important;
    border-color:#343a46!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
  }

  /* Prevent a bright focus ring around the rounded ends. */
  html.gsmview-dark #header-wrap #nav-search,
  html.gsmview-dark #nav-search{
    /* The outer wrapper must not create a second bright/incorrect edge.
       The visible border belongs to .search-form. */
    border:0!important;
    border-color:transparent!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
    background:transparent!important;
  }

  /* The actual visible capsule edge — dark mode only. */
  html.gsmview-dark #header-wrap #nav-search .search-form,
  html.gsmview-dark #nav-search .search-form{
    background:#181b21!important;
    background-color:#181b21!important;
    border:1px solid #343a46!important;
    border-color:#343a46!important;
    border-radius:27px!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
  }
}



@media screen and (min-width:981px){

  /* Outer - no border, no overflow clipping */
  #header-wrap #nav-search,
  #nav-search{
    border:0!important;
    border-width:0!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
    overflow:visible!important;
    background:transparent!important;
  }

  /* The form will carry the exact same border as 3-dot search */
  #header-wrap #nav-search .search-form,
  #nav-search .search-form{
    box-sizing:border-box!important;
    border-radius:27px!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-box-shadow:none!important;
  }

  /* NORMAL MODE - exact same color as 3-dot */
  html:not(.gsmview-dark) #header-wrap #nav-search .search-form,
  html:not(.gsmview-dark) #nav-search .search-form{
    background:#ffffff!important;
    background-color:#ffffff!important;
    border:1px solid #cfd4dc!important;
  }

  /* NIGHT MODE - exact same color as 3-dot */
  html.gsmview-dark #header-wrap #nav-search .search-form,
  html.gsmview-dark #nav-search .search-form{
    background:#181b21!important;
    background-color:#181b21!important;
    border:1px solid #343a46!important;
  }
}

/* Pagination for the Latest / Upcoming homepage sections */
.gsm-section-pagination{
  overflow:hidden;
  clear:both;
  margin:10px 0 20px;
  text-align:center;
}
.gsm-extra-section .gsm-section-pagination{
  float:none;
}

/* GSM VIEW: chat input row — search bar, mic button and send button get a full,
   even border on all 4 sides (the browser's default inset/outset border was drawing
   only partial dark edges). Only the border is changed — shape, size and fill colors
   stay exactly as they were. Works in Normal and Night mode. */
html:not(.gsmview-dark) .aiInput input,
html:not(.gsmview-dark) .aiInput button{
  border:2px solid #000 !important;
}
html.gsmview-dark .aiInput input,
html.gsmview-dark .aiInput button{
  border:1px solid #343a46 !important;
}
/* Night mode: the area around the input bar, mic and send buttons is the same
   black as the rest of the chat page (it was a lighter gray). */
html.gsmview-dark .aiInput{
  background:#0f1115 !important;
}
/* Clicking into the input must not change its border: switch off the browser's
   default focus ring/outline so the original border stays exactly as it is.
   Same in Normal and Night mode. */
.aiInput input:focus,
.aiInput input:focus-visible,
html.gsmview-dark .aiInput input:focus,
html.gsmview-dark .aiInput input:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}
/* Corner shape: identical in Normal and Night mode (square, as in Normal mode). */
.aiInput input,
.aiInput button,
html.gsmview-dark .aiInput input,
html.gsmview-dark .aiInput button{
  border-radius:0 !important;
}