/* KhabarThali v6.38.0 — additive reader/follow/reaction/mobile-nav refinement.
   Scoped to existing classes; no previous layout files are removed. */

/* Follow/unfollow clarity */
[data-follow]{
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
[data-follow][aria-pressed="true"]{
  background:color-mix(in srgb,var(--kt-blue,#00499a) 9%,var(--kt-paper,#fff))!important;
  color:var(--kt-blue,#00499a)!important;
  border-color:color-mix(in srgb,var(--kt-blue,#00499a) 32%,var(--kt-line,#dfe5e9))!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--kt-blue,#00499a) 8%,transparent);
}
[data-follow]:active{transform:scale(.97)}

/* Inline single-post summary */
.kt638-inline-summary{
  position:relative;
  overflow:hidden;
  margin:18px 0 28px;
  padding:20px 22px 17px;
  border:1px solid color-mix(in srgb,var(--kt-blue,#00499a) 18%,var(--kt-line,#dfe5e9));
  border-radius:14px;
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--kt-blue,#00499a) 7%,transparent),transparent 34%),
    linear-gradient(145deg,color-mix(in srgb,var(--kt-blue,#00499a) 3%,var(--kt-paper,#fff)),var(--kt-paper,#fff));
  box-shadow:0 10px 28px rgba(9,41,68,.045);
}
.kt638-summary-head,.kt638-summary-head>div,.kt638-summary-foot{display:flex;align-items:center}
.kt638-summary-head{justify-content:space-between;gap:16px;margin-bottom:12px}
.kt638-summary-head>div{gap:11px;min-width:0}
.kt638-summary-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:10px;background:var(--kt-blue,#00499a);color:#fff}
.kt638-summary-head .kt-eyebrow{margin:0 0 1px;font-size:9px;letter-spacing:.09em;color:var(--kt-muted,#62717d)}
.kt638-summary-head h2{margin:0;font-size:19px;line-height:1.35;color:var(--kt-ink,#102733)}
.kt638-summary-badge{flex:0 0 auto;padding:4px 7px;border:1px solid color-mix(in srgb,var(--kt-blue,#00499a) 20%,var(--kt-line,#dfe5e9));border-radius:999px;color:var(--kt-blue,#00499a);font-size:8px;font-weight:850;letter-spacing:.08em}
.kt638-inline-summary ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.kt638-inline-summary li{position:relative;margin:0;padding-left:19px;color:var(--kt-ink,#102733);font-size:14px;line-height:1.72}
.kt638-inline-summary li::before{content:"";position:absolute;left:1px;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--kt-red,#e6002c);box-shadow:0 0 0 4px color-mix(in srgb,var(--kt-red,#e6002c) 8%,transparent)}
.kt638-summary-foot{justify-content:space-between;gap:14px;margin-top:13px;padding-top:10px;border-top:1px solid color-mix(in srgb,var(--kt-line,#dfe5e9) 82%,transparent)}
.kt638-summary-foot small{color:var(--kt-muted,#62717d);font-size:10px;line-height:1.55}
.kt638-summary-foot button{flex:0 0 auto;border:0;background:transparent;color:var(--kt-blue,#00499a);font:inherit;font-size:10px;font-weight:800;cursor:pointer}
.kt638-inline-summary.is-collapsed ul,.kt638-inline-summary.is-collapsed .kt638-summary-foot small{display:none}
.kt638-inline-summary.is-collapsed{padding-bottom:13px}
.kt638-inline-summary.is-collapsed .kt638-summary-foot{justify-content:flex-end;margin-top:6px;padding-top:6px}

/* Reactions: intentionally one line on every viewport. Narrow screens scroll instead of wrapping. */
.kt-reactions{margin:22px 0!important;padding:12px 14px!important;border-radius:11px!important}
.kt-reaction-heading{align-items:center!important;margin-bottom:9px!important}
.kt-reaction-heading .kt-eyebrow{display:none}
.kt-reaction-heading h3{font-size:14px!important;line-height:1.35!important}
.kt-reaction-heading small{font-size:9px!important}
.kt-reaction-grid{
  display:flex!important;
  grid-template-columns:none!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  padding:1px 1px 4px;
  scrollbar-width:none;
}
.kt-reaction-grid::-webkit-scrollbar{display:none}
.kt-reaction-grid button{
  flex:1 0 98px;
  min-width:98px;
  min-height:36px!important;
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center;
  justify-content:center;
  gap:5px!important;
  padding:6px 7px!important;
  border-radius:8px!important;
  scroll-snap-align:start;
  white-space:nowrap;
}
.kt-reaction-emoji{font-size:15px;line-height:1}
.kt-reaction-label{font-size:10px!important;line-height:1.2;font-weight:750}
.kt-reaction-grid button strong{font-size:8px!important;line-height:1;color:var(--kt-muted,#62717d)}
.kt-reactions>p[role="status"]{margin:6px 0 0!important;font-size:9px!important}

/* Mobile bottom navigation: six actions, smaller and in one compact dock. */
@media(max-width:767px){
  body.kt-has-bottom-nav{padding-bottom:62px!important}
  .kt615-bottom-nav{
    height:56px!important;
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:1px!important;
    padding:3px 2px max(3px,env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
  }
  .kt615-bottom-nav>a:not(.kt634-mobile-submit),
  .kt615-bottom-nav>button,
  .kt615-bottom-nav>.kt634-mobile-submit{
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    min-height:48px!important;
    height:48px!important;
    padding:2px 1px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:1px!important;
    border:0!important;
    border-radius:8px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:var(--kt-muted,#62717d)!important;
    font-size:8.5px!important;
    font-weight:720!important;
    line-height:1.05!important;
    white-space:normal!important;
    text-align:center!important;
  }
  .kt615-bottom-nav>a svg,.kt615-bottom-nav>button svg,.kt615-bottom-nav>.kt634-mobile-submit svg{width:17px!important;height:17px!important;flex:0 0 17px}
  .kt615-bottom-nav>.kt634-mobile-submit{color:var(--kt-red,#e6002c)!important;background:color-mix(in srgb,var(--kt-red,#e6002c) 6%,transparent)!important}
  .kt615-bottom-nav>.kt634-mobile-submit::before{content:none!important}
  .kt615-bottom-nav .is-active{background:color-mix(in srgb,var(--kt-red,#e6002c) 7%,transparent)!important;color:var(--kt-red,#e6002c)!important}
  .kt615-bottom-nav .is-active::after{bottom:1px!important;width:14px!important}
  .kt-toast{bottom:64px!important}

  .kt638-inline-summary{margin:14px 0 22px;padding:16px 15px 14px;border-radius:12px}
  .kt638-summary-head{align-items:flex-start;gap:10px}
  .kt638-summary-icon{width:34px;height:34px;flex-basis:34px}
  .kt638-summary-head h2{font-size:17px}
  .kt638-inline-summary li{font-size:13px;line-height:1.68;padding-left:17px}
  .kt638-summary-foot{align-items:flex-start;gap:8px}
  .kt638-summary-foot small{font-size:9px}
  .kt638-summary-foot button{font-size:9px}

  .kt-reactions{padding:10px!important;margin:18px 0!important}
  .kt-reaction-heading{margin-bottom:7px!important}
  .kt-reaction-heading h3{font-size:12.5px!important}
  .kt-reaction-heading small{display:none!important}
  .kt-reaction-grid button{flex-basis:82px;min-width:82px;min-height:34px!important;padding:5px!important;gap:4px!important}
  .kt-reaction-emoji{font-size:14px}
  .kt-reaction-label{font-size:9px!important}
  .kt-reaction-grid button strong{font-size:7.5px!important}

  .kt-ref-follow,[data-follow]{min-height:34px!important;padding:6px 10px!important;font-size:10px!important;border-radius:8px!important}
}

@media(max-width:360px){
  .kt615-bottom-nav>a:not(.kt634-mobile-submit),.kt615-bottom-nav>button,.kt615-bottom-nav>.kt634-mobile-submit{font-size:7.5px!important}
  .kt615-bottom-nav a svg,.kt615-bottom-nav button svg,.kt615-bottom-nav>.kt634-mobile-submit svg{width:16px!important;height:16px!important}
}

/* Dark palette integration without turning the panels pure black. */
:root[data-theme=dark] .kt638-inline-summary{
  background:linear-gradient(145deg,color-mix(in srgb,var(--kt-blue,#2c86cf) 8%,#15232e),#14212b);
  border-color:#2d414f;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
}
:root[data-theme=dark] .kt638-summary-head h2,
:root[data-theme=dark] .kt638-inline-summary li{color:#edf3f6}
:root[data-theme=dark] .kt615-bottom-nav>.kt634-mobile-submit{background:rgba(230,0,44,.08)!important;color:#ff6d80!important}

@media(prefers-reduced-motion:reduce){[data-follow]{transition:none!important}.kt-reaction-grid{scroll-behavior:auto!important}}