/* Drugestan Health Magazine v1.40.0 — Real photo refinement
   Goal: keep the approved structure, links and sizes, but make visuals more realistic,
   less fantasy-like, with larger non-cropped photo areas and text placed below the image. */

:root{
  --d40-navy:#173553;
  --d40-text:#24384b;
  --d40-muted:#687789;
  --d40-line:#dbe4ea;
  --d40-soft:#f8fbfc;
}

/* =========================
   HOME SHORTCUTS
   ========================= */
.dhm .dhm-shortcuts{
  gap:12px!important;
  padding:16px!important;
}
.dhm .dhm-shortcut{
  min-height:176px!important;
  padding:98px 12px 12px!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  text-align:right!important;
  background-position:center 10px!important;
  background-repeat:no-repeat!important;
  background-size:calc(100% - 20px) auto!important;
  border-radius:16px!important;
}
.dhm .dhm-shortcut::after{
  display:none!important;
}
.dhm .dhm-shortcut strong,
.dhm .dhm-shortcut small{
  width:100%!important;
  text-align:right!important;
}
.dhm .dhm-shortcut strong{
  font-size:15px!important;
  line-height:1.6!important;
  margin-top:2px!important;
}
.dhm .dhm-shortcut small{
  font-size:12px!important;
  line-height:1.7!important;
  margin-top:4px!important;
}

/* =========================
   HERO REFERENCE CARDS
   ========================= */
body[class*="single-dhms_"] .dhm-v23-hero-refcards{
  gap:14px!important;
}
body[class*="single-dhms_"] .dhm-v23-hero-ref{
  display:block!important;
  min-height:0!important;
  padding:12px!important;
}
body[class*="single-dhms_"] .dhm-v23-hero-ref-icon{
  display:block!important;
  width:100%!important;
  height:72px!important;
  margin:0 0 10px!important;
  border-radius:10px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:contain!important;
  background-color:#fff!important;
}
body[class*="single-dhms_"] .dhm-v23-hero-ref > div{
  display:block!important;
}
body[class*="single-dhms_"] .dhm-v23-hero-ref strong,
body[class*="single-dhms_"] .dhm-v23-hero-ref p{
  display:block!important;
  text-align:right!important;
}

/* =========================
   SIX NAV CARDS UNDER HERO
   ========================= */
body[class*="single-dhms_"] .dhm-v21-six-card summary{
  grid-template-columns:1fr 16px!important;
  grid-template-areas:
    "img img"
    "title open"!important;
  row-gap:9px!important;
  column-gap:8px!important;
  padding:10px 10px 12px!important;
  min-height:110px!important;
  align-items:end!important;
}
body[class*="single-dhms_"] .dhm-v21-six-icon{
  grid-area:img!important;
  width:100%!important;
  height:58px!important;
  border-radius:9px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:contain!important;
  background-color:#fff!important;
}
body[class*="single-dhms_"] .dhm-v21-six-title{
  grid-area:title!important;
  display:block!important;
  line-height:1.55!important;
}
body[class*="single-dhms_"] .dhm-v21-six-open{
  grid-area:open!important;
  align-self:end!important;
}

/* =========================
   QUICK ANSWER / RELATED PRODUCTS
   ========================= */
body[class*="single-dhms_"] .dhm-v31-quick-card::before,
body[class*="single-dhms_"] .dhm-v16-left-product::before{
  height:82px!important;
  margin:0 0 14px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:contain!important;
  background-color:#fff!important;
}
body[class*="single-dhms_"] .dhm-v31-quick-card,
body[class*="single-dhms_"] .dhm-v16-left-product{
  padding:12px 14px 14px!important;
}

/* =========================
   MAIN TITLES IN LOWER MODULES
   Image above title, not beside it
   ========================= */
body[class*="single-dhms_"] #dhm-main-text > h2,
body[class*="single-dhms_"] #dhm-faq > h2,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-action > h2,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-warning > h2,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-pharmacist-section > h2,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-professional > h2,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-sources > h2,
body[class*="single-dhms_"] .dhm-v22-refine #dhm-scientific-sources > h2{
  display:block!important;
}
body[class*="single-dhms_"] #dhm-main-text > h2::before,
body[class*="single-dhms_"] #dhm-faq > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-action > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-warning > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-pharmacist-section > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-professional > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine .dhm-v16-modules > .dhm-sync-sources > h2::before,
body[class*="single-dhms_"] .dhm-v22-refine #dhm-scientific-sources > h2::before{
  display:block!important;
  width:120px!important;
  max-width:100%!important;
  height:56px!important;
  margin:0 0 10px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:contain!important;
  background-color:#fff!important;
}

/* =========================
   HOMEPAGE RECOMMENDATIONS
   Remove avatar feel, use real photo headers
   ========================= */
.dhm .dhm-answer-card{
  position:relative!important;
  padding:12px 16px 16px!important;
  overflow:hidden!important;
}
.dhm .dhm-answer-top{
  display:block!important;
  padding-top:84px!important;
  position:relative!important;
}
.dhm .dhm-answer-top::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  right:0!important;
  left:0!important;
  height:72px!important;
  border-radius:10px!important;
  background:url('photos-v39/pharmacist.jpg') center/contain no-repeat #fff!important;
  border:1px solid #e2e9ee!important;
}
.dhm .dhm-avatar{
  display:none!important;
}
.dhm .dhm-answer-top small,
.dhm .dhm-answer-top h3,
.dhm .dhm-answer-card p{
  display:block!important;
  text-align:right!important;
}

/* =========================
   HOMEPAGE TOOLS
   Use real photo panels instead of calc icon
   ========================= */
.dhm .dhm-tool-grid>div{
  position:relative!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  padding:12px 14px 14px!important;
  min-height:162px!important;
}
.dhm .dhm-tool-grid>div::before{
  content:""!important;
  display:block!important;
  width:100%!important;
  height:74px!important;
  margin:0 0 12px!important;
  border-radius:10px!important;
  border:1px solid #dfe7ec!important;
  background:center/contain no-repeat #fff!important;
}
.dhm .dhm-tool-grid>div:nth-child(1)::before{background-image:url('photos-v39/tools.jpg')!important}
.dhm .dhm-tool-grid>div:nth-child(2)::before{background-image:url('photos-v39/guide.jpg')!important}
.dhm .dhm-tool-grid>div:nth-child(3)::before{background-image:url('photos-v39/research.jpg')!important}
.dhm .dhm-tool-grid>div>span{display:none!important}
.dhm .dhm-tool-grid strong,
.dhm .dhm-tool-grid small{
  display:block!important;
  text-align:right!important;
}

/* =========================
   Improve card photo containment generally
   ========================= */
.dhm .dhm-thumb img{
  object-fit:cover!important;
  object-position:center!important;
}

/* =========================
   MOBILE
   ========================= */
@media(max-width:760px){
  .dhm .dhm-shortcuts{
    padding:10px!important;
    gap:10px!important;
  }
  .dhm .dhm-shortcut{
    min-height:154px!important;
    padding:86px 8px 10px!important;
    background-size:calc(100% - 14px) auto!important;
    background-position:center 8px!important;
  }
  body[class*="single-dhms_"] .dhm-v23-hero-ref-icon{height:64px!important}
  body[class*="single-dhms_"] .dhm-v21-six-card summary{
    min-height:96px!important;
    padding:8px!important;
  }
  body[class*="single-dhms_"] .dhm-v21-six-icon{height:46px!important}
  body[class*="single-dhms_"] .dhm-v31-quick-card::before,
  body[class*="single-dhms_"] .dhm-v16-left-product::before{height:70px!important}
  .dhm .dhm-answer-top{padding-top:74px!important}
  .dhm .dhm-answer-top::before{height:62px!important}
  .dhm .dhm-tool-grid>div{min-height:146px!important}
  .dhm .dhm-tool-grid>div::before{height:64px!important}
}
