


:root {
    --bg-p: #1a1c1e; /* bg-primary */
    --bg-s: #121212; /* bg-secondary */
    --bg-c: #1e2022; /* bg-card */
    --bg-ca: #242629; /* bg-card-alt */
    --bg-ch: #333537; /* bg-card-hover */
    --bg-b: #2a2c2f; /* bg-button */
    --bg-bh: #3e4044; /* bg-button-hover */
    --bg-ba: #3e4044; /* bg-button-active */
    --bg-bacc: #fbbf24; /* bg-button-accent (amber-500) */
    --bg-bacch: #f59e0b; /* bg-button-accent-hover (amber-600) */
    --bg-in: #2a2c2f; /* bg-input */
    --tx-p: #e2e2e5; /* text-primary */
    --tx-s: #a8abb4; /* text-secondary */
    --tx-m: #5f6368; /* text-muted */
    --tx-acc: #fbbf24; /* text-accent (amber-500) */
    --tx-onacc: #121212; /* text-on-accent */
    --br-p: #333537; /* border-primary */
    --br-s: #393939; /* border-secondary */
    --br-f: #fbbf24; /* border-focus (amber-500) */
    --sh-f: rgba(251, 191, 36, 0.3); /* shadow-focus */
    --sh-c: 0 4px 6px -1px rgba(0,0,0,0.2), 0 2px 4px -2px rgba(0,0,0,0.2); /* shadow-card */
    --sh-ch: 0 10px 15px -3px rgba(0,0,0,0.2),0 4px 6px -2px rgba(0,0,0,0.2); /* shadow-card-hover */
    --lnk-c: #fbbf24; /* link-color (amber-500) */
    --lnk-ch: #fde047; /* link-hover-color (amber-300) */
    --hl-c: #fbbf24; /* highlight-color (amber-500) */
    --ibnr-bg: #2a2c2f; /* info-banner-bg */
    --ibnr-br: #393939; /* info-banner-border */
    --ibnr-tx: #c4c6cf; /* info-banner-text */
    --srch-c-bg: var(--bg-ca); /* search-container-bg default for dark */
    --srch-c-br: var(--srch-c-br); /* search-container-border default for dark */
    --tbl-bg: #2d3748; /* dark blue-gray */
    --tbl-head-bg: #1a202c; /* darker blue-gray */
    --tbl-border: #4a5568; /* gray for borders */
    --tbl-text: var(--tx-p);
    --tbl-hover-bg: #4a5568;
}

body{font-family:'Inter','Noto Sans SC','Noto Sans Arabic','Noto Sans JP','Noto Sans KR',sans-serif;background-color:var(--bg-p);color:var(--tx-p);}
.fwb { font-weight: bold; }
#sBnr { background-color: var(--bg-s); color: var(--tx-m); padding: 0.5rem 0; text-align: center; font-size: 0.875rem; width: 100%; border-bottom: 1px solid var(--br-p); }
#sBnr a { color: var(--tx-acc); } #sBnr a:hover { color: var(--lnk-ch); }

.nChC{position:relative;width:100%;max-width:800px;margin-left:auto;margin-right:auto;height:350px;} 
@media (min-width:768px){.nChC{height:450px;}}
header{background-color:var(--bg-s);box-shadow:0 1px 2px 0 rgba(0,0,0,.08);border-bottom:1px solid var(--br-p);}
header nav a,header h1{color:var(--tx-p);}header nav a:hover{color:var(--tx-acc);}header nav .text-gray-300{color:var(--tx-m);}

.nBtn{background-color:var(--bg-b);color:var(--tx-p);transition:background-color .2s,color .2s; border: 1px solid var(--br-s);} 
.nBtn:hover,.nBtn[aria-expanded="true"], .nBtn.active{background-color:var(--bg-bh);color:var(--tx-acc);}
.nBtnA{background-color:transparent;color:var(--tx-p);transition:background-color .2s,color .2s;} 
.nBtnA:hover{background-color:var(--bg-b);color:var(--tx-acc);}

.nDrp{position:absolute;right:0;margin-top:.5rem;width:auto;min-width:max-content;border-radius:.375rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);background-color:var(--bg-c);border:1px solid var(--br-s);padding:.25rem;z-index:30;} 
.nDrp .flex { display: flex; flex-direction: column; gap: 0.125rem; } 
.nLnk{display:block;padding:.25rem .5rem;font-size:.75rem;color:var(--tx-s);border-radius:.25rem;transition:background-color .2s,color .2s;text-decoration:none;white-space:nowrap;} 
.nLnk:hover{background-color:var(--bg-b);color:var(--tx-acc);}

.nLnB.active { font-weight: 700; color: var(--tx-onacc) !important; background-color: var(--bg-bacc) !important; border-color: var(--bg-bacc) !important;}
.nLnB.active:hover { background-color: var(--bg-bacch) !important; border-color: var(--bg-bacch) !important;}
.nLnM.active { font-weight: 700; color: var(--tx-acc) !important; }
.nLnM:hover:not(.active) { background-color: var(--bg-b) !important; color: var(--tx-acc) !important;}
.nLnkM { display: block; padding: 0.75rem 1rem; font-size: 0.875rem; color: var(--tx-s); border-bottom: 1px solid var(--br-p); text-decoration: none; }
.nLnkM:hover { background-color: var(--bg-bh); color: var(--tx-acc); }

.nCrd{background-color:var(--bg-c);border:1px solid var(--br-s);border-radius:.75rem;padding:1.5rem;text-align:center;box-shadow:var(--sh-c);transition:transform .2s,box-shadow .2s;} 
.nCrd:hover{transform:translateY(-5px);box-shadow:var(--sh-ch);}
.nCHd{font-size:2.25rem;font-weight:700;color:var(--tx-acc);} 
.nCSb{font-size:1rem;font-weight:600;color:var(--tx-s);margin-top:.5rem;} 
.nSecB{border:1px solid var(--br-s);background-color:var(--bg-c);} 
#is1, .nSecB h2, .nSecB h3, .nSecB h4, .nSWF h2, .nSWF h3, .nSWF h4, #aiAn h2, #txIf h2, #txIf h3, #sGlbCmp h2 {color:var(--tx-p);} 
.nSecB p, .nSecB li, .nSecB figcaption, .nSWF p, .nSWF li, .nSWF figcaption, #aiAn p, #aiAn li, #txIf p, #txIf li, #sGlbCmp p, #sGlbCmp li {color:var(--tx-s);} 
#dDet .border, #dDet > div > div { background-color: var(--bg-ca); border: 1px solid var(--br-s); border-radius: 0.5rem; padding: 1rem; }
#dDet h3, #dDet h4, #dDet p, #dDet li { color: var(--tx-s); }
#dDet h3 { color: var(--tx-p); font-size: 1.25rem; } 
#dDet .fwb { color: var(--hl-c); font-weight: bold; } 

#is1{background-color:var(--bg-ca);} 
#is2{background-color:var(--bg-c); padding: 1rem;} 
#is1 h2, #is2 h3 {color:var(--tx-p);} 
#is1 p, #is2 p, #is2 li {color:var(--tx-s); font-size: 0.8rem; line-height: 1.4;} 
#is2 a { color: var(--lnk-c); text-decoration: underline; }
#is2 a:hover { color: var(--lnk-ch); }
#is2 ul { list-style: disc; padding-left: 1.5rem; margin-top: 0.5rem; }


#nbBx{background-color:var(--ibnr-bg);color:var(--ibnr-tx); border-radius: 0.375rem;} 
#nbBx .nHLT{color:var(--hl-c); font-weight: bold;} 
html[dir="rtl"] #nbBx{border-left:none;border-right:4px solid var(--hl-c);} html[dir="ltr"] #nbBx{border-right:none;border-left:4px solid var(--hl-c);}
.nTbl{width:100%;margin-top:1rem;border-collapse:collapse;}.nTbl th,.nTbl td{border:1px solid var(--br-s);padding:.5rem .75rem;text-align:left;font-size:.875rem;vertical-align:top;color:var(--tx-s);}.nTbl th{background-color:var(--bg-ca);font-weight:600;color:var(--tx-p);}.nTbl tbody tr:nth-child(even){background-color:var(--bg-ca);}.nTbl tbody tr:hover{background-color:var(--bg-ch);} 
input[type="range"]{-webkit-appearance:none;appearance:none;background:var(--tx-m);border-radius:5px;}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--tx-acc);cursor:pointer;border-radius:50%;}input[type="range"]::-moz-range-thumb{width:20px;height:20px;background:var(--tx-acc);cursor:pointer;border-radius:50%;border:none;}
.nHLT{font-weight:600;color:var(--hl-c);} 

.hd {display: none !important;}
.nBtT{padding:.25rem .75rem;border-radius:.25rem;font-size:.875rem;font-weight:600;transition:background-color .3s,color .3s;cursor:pointer;border:1px solid var(--br-s);}.nBtT.active{background-color:var(--bg-bacc);color:var(--tx-onacc);border-color:var(--bg-bacc);}.nBtT:not(.active){background-color:transparent;color:var(--tx-s);}.nBtT:not(.active):hover{background-color:var(--bg-b);border-color:var(--tx-s);} 
.nDCard{background-color:var(--bg-ca);border:1px solid var(--br-s);border-radius:.5rem;padding:1rem;cursor:pointer;transition:all .3s ease;}.nDCard:hover{border-color:var(--hl-c);box-shadow:0 0 15px rgba(251,191,36,.1);}.nDCard h3{color:var(--tx-p); text-align: center; margin: 0;} 
.nDDesc{max-height:0;overflow:hidden;transition:max-height .5s ease-out,opacity .5s ease-out,visibility .5s ease-out, margin-top .5s ease-out;opacity:0;visibility:hidden;margin-top:0;}.nDDesc p{color:var(--tx-s); font-size: 0.85rem; padding-top: 0.5rem; text-align: left; } 
.nDCard.active .nDDesc {max-height: 500px; opacity: 1; visibility: visible; margin-top: 0.75rem;}

#glbFiscTbl { background-color: var(--tbl-bg); color: var(--tbl-text); border-collapse: collapse; width: 100%; }
#glbFiscTbl th, #glbFiscTbl td { border: 1px solid var(--tbl-border); padding: 0.75rem; text-align: left; font-size: 0.8rem; line-height: 1.4;}
#glbFiscTbl th { background-color: var(--tbl-head-bg); font-weight: 600; }
#glbFiscTbl tbody tr:hover { background-color: var(--tbl-hover-bg); }
#sGlbCmp .text-xs { color: var(--tx-s); } 
#sGlbCmp h2 { margin-bottom: 1rem; }
#glbFiscTbl th.colWf, #glbFiscTbl td.colWf { min-width: 200px; width: 35%; } 
#sGlbCmp p[data-lang-key="kGlbSnpIntro"] { margin-bottom: 1rem;}

/* Revenue Notes Section - New Styles */
.revNoteItem {
    background-color: var(--bg-c); /* Card background */
    border: 1px solid var(--br-s);
    border-radius: 0.5rem;
    padding: 1rem;
}
.revNoteItem .nHLT { /* For titles in the revenue notes */
  color: var(--tx-p);
  font-weight: 600;
  margin-bottom: 0; /* Ensure h3 inside button has no bottom margin */
}
.revNoteToggle { /* Mobile toggle button */
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-color: transparent;
    border: none;
    padding: 0 0 0.5rem 0; /* Padding for title */
    margin-bottom: 0.5rem;
    border-bottom: 1px solid var(--br-p);
    cursor: pointer;
    text-align: left;
    color: var(--tx-p);
}
.revNoteToggle:focus {
    outline: 2px solid var(--br-f);
    outline-offset: 2px;
}
.revNoteIcon {
    transition: transform 0.3s ease;
    font-size: 0.8em;
}
.revNoteToggle[aria-expanded="true"] .revNoteIcon {
    transform: rotate(180deg);
}
.revNoteContent {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-out, opacity 0.3s ease-out;
    opacity: 0;
}
.revNoteToggle[aria-expanded="true"] + .revNoteContent {
    max-height: 1500px; /* Adjust as needed */
    opacity: 1;
    margin-top: 0.75rem;
}
@media (min-width: 768px) { /* md breakpoint */
  .revNoteContent {
    max-height: none !important; /* Override for desktop */
    opacity: 1 !important;
    overflow: visible !important;
    margin-top: 0.75rem; /* Standard margin for desktop if title is shown */
  }
   .revNoteItem .nHLT { /* Titles for desktop were hidden inside button, now shown separately */
        margin-bottom: 0.75rem;
   }
}
.revNoteContent p, .revNoteContent ul {
  color: var(--tx-s);
  font-size: 0.8rem;
  line-height: 1.6;
}
.revNoteContent .fwb {
  color: var(--hl-c);
  font-weight: bold;
}
.fbtSubSection {
    background-color: var(--bg-ca);
    padding: 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid var(--br-s);
}
.fbtSubSection h4 {
    color: var(--tx-p);
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
#fbtL {
    list-style-position: inside;
    padding-left: 0.25rem;
    margin-top: 0.25rem;
}
#fbtL li .fwb {
    color: var(--hl-c);
    font-weight: bold;
}

.cvdCrd {}

/* Section 9: The Path Forward Redesign */
#s9 .triCd {
    background-color: var(--bg-ca);
    border: 1px solid var(--br-s);
    border-radius: 0.75rem;
    padding: 1.5rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}
#s9 .triCd:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: var(--sh-ch);
    border-color: var(--hl-c);
}
#s9 .triIc { /* For emoji icons */
    font-size: 2.5rem;
    line-height: 1;
    transition: transform 0.3s ease;
}
#s9 .triCd:hover .triIc {
    transform: scale(1.15);
}
#s9 .triCd h3 {
    color: var(--tx-p);
    font-size: 1.125rem;
}
#s9 .triCd p {
    color: var(--tx-s);
    font-size: 0.875rem;
}
/* Accordion for Strategic Outlook */
.fOHe {
    background-color: var(--bg-ca);
    padding: 1rem 1.25rem;
    width: 100%;
    border: 1px solid var(--br-s);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    color: var(--tx-p);
    font-weight: 600;
}
.fOHe:hover {
    background-color: var(--bg-ch);
    border-color: var(--hl-c);
}
.fOHe.actv {
    background-color: var(--bg-bacc);
    color: var(--tx-onacc);
    border-color: var(--bg-bacc);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.fIcn {
    font-size: 1.25rem;
    line-height: 1;
}
.fInd {
    font-size: 1.25rem;
    line-height: 1;
}
.fOBo {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding-top 0.4s ease-out, padding-bottom 0.4s ease-out, opacity 0.4s ease-out;
    background-color: var(--bg-c);
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    opacity: 0;
    border-radius: 0 0 0.5rem 0.5rem;
    border: 1px solid transparent;
    border-top: none;
}
.fOBo.show {
    opacity: 1;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    max-height: 500px;
    border-color: var(--bg-bacc);
}
.fOBo p {
    color: var(--tx-s);
    line-height: 1.6;
    margin: 0;
}


footer.ftrSrc { border-top: 1px solid var(--br-p); color: var(--tx-s); background-color: var(--bg-s); padding: 2rem 1rem; margin-top: 3rem; text-align: left; }
html[dir="rtl"] footer.ftrSrc { text-align: right; }
footer.ftrSrc h3 { color: var(--tx-acc); font-size: 1.25rem; font-weight: 700; margin-bottom: 1.5rem; }
footer.ftrSrc .cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; }
footer.ftrSrc .col-group h4 { color: var(--tx-p); font-size: 0.9rem; font-weight: 600; margin-bottom: 0.5rem; }
footer.ftrSrc .col-group ul { list-style: none; padding: 0; margin: 0; }
footer.ftrSrc .col-group li { display: inline-block; margin-right: 0.75rem; margin-bottom: 0.25rem; } /* Updated for horizontal flow */
footer.ftrSrc .col-group a { color: var(--tx-s); text-decoration: none; font-size: 0.8rem; transition: color 0.2s; }
footer.ftrSrc .col-group a:hover { color: var(--lnk-ch); text-decoration: underline; }
footer.ftrSrc p.ftrSrcP { font-size: 0.8rem; color: var(--tx-m); text-align: center; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--br-p); line-height: 1.6; }
footer.ftrSrc .ftrSrchCont { margin-top: 1.5rem; } /* Container for search bar before copyright */


#rvD ul { padding-left: 0; list-style: none; } 
#rvD ul li { padding: 0.3rem 0; border-bottom: 1px solid var(--br-s); }
#rvD ul li:last-child { border-bottom: none; }
#rvD ul li > span.fwb { display: block; font-weight: 600; color: var(--tx-p); margin-bottom: 0.25rem; }
.rvLI { display: flex; justify-content: space-between; align-items: flex-start; padding: 0.5rem 0; font-size: 0.95rem; } 
.rvAm { font-weight: 600; color: var(--tx-acc); margin-right: 1rem; white-space: nowrap; } 
.rvDG { flex-grow: 1; text-align: right; } 
html[dir="rtl"] .rvDG { text-align: left; }
html[dir="rtl"] .rvAm { margin-right: 0; margin-left: 1rem; }
.rvMD { display: block; color: var(--tx-s); } 
.rvSD { display: block; font-size: 0.8em; color: var(--tx-m); margin-top: 0.1rem; } 

#txBrChCo { height: 250px; max-width: 600px; margin-bottom: 1rem; } 
#rvIP { color: var(--tx-s); } 
#rvIP .fwb { color: var(--tx-p); font-weight: bold; }
#rvD .overflow-y-auto::-webkit-scrollbar{width:8px;}#rvD .overflow-y-auto::-webkit-scrollbar-track{background:var(--bg-b);border-radius:10px;}#rvD .overflow-y-auto::-webkit-scrollbar-thumb{background:var(--tx-m);border-radius:10px;}#rvD .overflow-y-auto::-webkit-scrollbar-thumb:hover{background:var(--tx-s);}}#rvD .overflow-y-auto{scrollbar-width:thin;scrollbar-color:var(--tx-m) var(--bg-b);} 
#dChC>div{display:flex;flex-direction:column;flex-grow:1;} 
#rvD{display:flex;flex-direction:column;}#rvD>div:last-child{flex-grow:1;} 
@media (min-width:1024px){#mTgl,#mMnu{display:none;}} 
.nSWF{background-color:var(--bg-c);border-left:5px solid var(--hl-c);}html[dir="rtl"] .nSWF{border-left:none;border-right:5px solid var(--hl-c);} 
.s3-compact .nSWF p, .s3-compact .nSWF figcaption, .s3-compact .nTbl th, .s3-compact .nTbl td {
    font-size: 0.75rem; /* Smaller font for welfare breakdown */
    padding: 0.3rem 0.5rem; /* Reduced padding for table cells */
}
.s3-compact .nSWF h3 { font-size: 1rem; }

@media (max-width: 767px) { 
    #tb3 tbody tr td:nth-child(1)::before { content: attr(data-label-cat) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
    #tb3 tbody tr td:nth-child(2)::before { content: attr(data-label-exp) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
    #tb3 tbody tr td:nth-child(3)::before { content: attr(data-label-det) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
    #tb3 tfoot tr td#tOtW::before { content: attr(data-label-cat) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
    #tb3 tfoot tr td#tOtC::before { content: attr(data-label-exp) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
    #tb3 tfoot tr td#tOtD::before { content: attr(data-label-det) " "; font-weight: bold; color: var(--tx-m); display: inline-block; margin-right: 0.5em;}
}

canvas+p{color:var(--tx-s);}

#aiAn textarea{background-color:#ffffff !important;color:#121212 !important;border:1px solid var(--br-s);transition:border-color .2s,box-shadow .2s; resize: none;}
#aiAn textarea:focus{border-color:var(--br-f);box-shadow:0 0 0 2px var(--sh-f);outline:none;}
#aiAn textarea::placeholder{color:var(--tx-m);}
#aiRp{background-color:var(--bg-in);border:1px solid var(--br-s);color:var(--tx-s); padding: 1rem; border-radius: 0.375rem; min-height: 100px; white-space: pre-wrap; overflow-wrap: break-word; display: none;} 
#aiSl ul li a{color:var(--lnk-c);}#aiSl ul li a:hover{text-decoration:underline;color:var(--lnk-ch);} 
#aiSb:disabled{opacity:.5;cursor:not-allowed;} 
#aiRp h1,#aiRp h2,#aiRp h3,#aiRp h4{color:var(--tx-p);margin-top:.75em;margin-bottom:.25em;font-weight:600;}
#aiRp h1{font-size:1.5em;}#aiRp h2{font-size:1.25em;}#aiRp h3{font-size:1.1em;}
#aiRp p{color:var(--tx-s);margin-bottom:.5em;line-height:1.6;}
#aiRp ul,#aiRp ol{color:var(--tx-s);margin-left:1.5em;margin-bottom:.5em;}
html[dir="rtl"] #aiRp ul,html[dir="rtl"] #aiRp ol{margin-left:0;margin-right:1.5em;}
#aiRp li{margin-bottom:.25em;}
#aiRp .fwb {font-weight: 600; color: var(--hl-c);} 
#aiRp em,#aiRp i{font-style:italic;color:var(--lnk-ch);} 
#aiRp code{background-color:var(--bg-b);padding:.1em .3em;border-radius:3px;font-family:'Courier New',Courier,monospace;color:var(--tx-s);}
#aiRp pre{background-color:var(--bg-b);padding:.5em;border-radius:4px;overflow-x:auto;margin-bottom:.75em;}#aiRp pre code{padding:0;background-color:transparent;}
#aiRp blockquote{border-left:3px solid var(--tx-m);padding-left:1em;margin-left:0;color:var(--tx-m);font-style:italic;}
html[dir="rtl"] #aiRp blockquote{border-left:none;border-right:3px solid var(--tx-m);padding-left:0;padding-right:1em;}
#aiRp hr{border-top:1px solid var(--br-s);margin-top:1em;margin-bottom:1em;}

#mMnu .nLnM { display: block; padding: 0.5rem 1rem; font-size: 0.875rem; color: var(--tx-s); }
#mMnu .nLnM.active { color: var(--tx-acc); font-weight: 600; }
#mMnu .nLnM:hover:not(.active) { background-color: var(--bg-bh); color: var(--tx-acc); }

/* Standard Google Search Bar Styles */
.gsbC { display: flex; gap: 0.5rem; align-items: center; padding: 0.75rem; border: 1px solid var(--br-s); border-radius: 0.5rem; background-color: var(--srch-c-bg); margin-top: 1rem; box-shadow: var(--sh-c); } 
.gsIn { flex-grow: 1; padding: 0.625rem 0.75rem; font-size: 0.875rem; color: var(--tx-p); background-color: var(--bg-in); border: 1px solid var(--br-s); border-radius: 0.25rem; transition: border-color 0.2s, box-shadow 0.2s; } 
.gsIn:focus { border-color: var(--br-f); box-shadow: 0 0 0 2px var(--sh-f); outline: none; }
.gsIn::placeholder { color: var(--tx-m); } 
.gsBt { padding: 0.625rem 1rem; font-size: 0.875rem; font-weight: 600; background-color: var(--bg-bacc); color: var(--tx-onacc); border: 1px solid var(--bg-bacc); border-radius: 0.25rem; transition: background-color .2s, border-color .2s; cursor: pointer; } 
.gsBt:hover { background-color: var(--bg-bacch); border-color: var(--bg-bacch); }

/* Dark Yellow Search Bar Styles - compacted */
.sYfC { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; padding: 0.75rem; /* Increased padding */ border: 1px solid var(--br-s); border-radius: 0.5rem; background-color: var(--bg-ca); margin-top: 0.5rem; /* Reduced margin */ box-shadow: var(--sh-c); } 
#sYfI, .sYfI { flex-grow: 1; padding: 0.75rem 0.8rem; /* Increased padding */ font-size: 0.875rem; /* Increased font size */ background-color: #ffffff !important; color: #121212 !important; border: 1px solid #555; border-radius: 0.25rem; transition: border-color 0.2s, box-shadow 0.2s; min-width: 150px; } 
#sYfI:focus, .sYfI:focus { border-color: var(--br-f); box-shadow: 0 0 0 2px var(--sh-f); outline: none; }
#sYfI::placeholder, .sYfI::placeholder { color: var(--tx-m); } /* Muted grey */
.sYfB { padding: 0.75rem 1rem; /* Increased padding */ font-size: 0.875rem; /* Increased font size */ font-weight: 600; background-color: var(--bg-bacc); color: var(--tx-onacc); border: 1px solid var(--bg-bacc); border-radius: 0.25rem; transition: background-color .2s, border-color .2s; cursor: pointer; } 
.sYfB:hover { background-color: var(--bg-bacch); border-color: var(--bg-bacch); }
.sYfLnk { font-size: 0.875rem; padding: 0.75rem 1rem; /* Match button padding */ line-height: 1.25rem; /* Match button line-height */ }
#srchScpExpP { 
    color: var(--tx-s); 
    font-size: 0.7rem; 
    line-height:1.3; 
    width: 100%; /* Ensure it takes full width to be visible */
    text-align: center; /* Center the text */
    margin-top: 0.25rem; /* Small margin for spacing */
    display: block; /* Ensure it's a block element to take width */
}


#txIf { background-color: var(--bg-c); border: 1px solid var(--br-s); padding: 1.5rem; margin-bottom: 4rem; border-radius: 0.75rem; scroll-margin-top: 5rem; } 
#txIf h2 { color: var(--tx-p); }
#txIf h3 { color: var(--tx-p); margin-top: 1.5rem; }
#txIf p, #txIf li { color: var(--tx-s); font-size: 0.875rem; line-height: 1.6; }
#txIf .fwb { font-weight: 600; color: var(--tx-p); } 
#txIf .txIL { margin-top: 0.5rem; } 
#txIf .txIL li { margin-bottom: 0.5rem; }
#txIf .txIL .fwb { display: block; margin-bottom: 0.125rem; } 
#txIf table.nTbl { margin-top: 0.5rem; } 
#txIf [data-lang-key="txDscl"] .fwb { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--br-s); font-size: 0.75rem; }
#txIf .nHLT { color: var(--hl-c); font-weight: 600; }


/* Styles for very narrow viewports, like AI Studio Preview */
@media (max-width: 480px) {
    header nav .container > .flex > .flex-grow { 
        flex-wrap: wrap; 
        justify-content: center; 
        gap: 0.1rem 0.25rem; 
    }
    header nav .container .flex-grow > a,
    header nav .container .flex-grow > div > a { 
        font-size: 0.8rem !important; 
        padding: 0.1rem 0.2rem !important; 
        margin: 0 !important; 
        flex-basis: auto; 
    }
    header nav .container .flex-grow > span.text-gray-300 { 
        display: none; 
    }

    header nav .hidden.lg\\:flex > .relative > #exB,
    header nav .hidden.lg\\:flex > a.nBtn-highlight {
        font-size: 0.7rem !important;
        padding: 0.2rem 0.4rem !important;
    }
    
    header nav .hidden.lg\\:flex button.nLnB,
    header nav .hidden.lg\\:flex a.nLnB {
        font-size: 0.7rem !important;
        padding: 0.2rem 0.3rem !important;
    }

    header nav #hS_c { 
        padding: 0.25rem !important;
        margin-top: 0.25rem !important; 
        flex-basis: 100%; 
    }
    header nav #hS_i, header nav .sYfI { 
        padding: 0.3rem 0.4rem !important;
        font-size: 0.75rem !important;
        min-width: 70px !important; 
    }
    header nav .sYfB { 
        padding: 0.3rem 0.5rem !important;
        font-size: 0.75rem !important;
    }

    header nav a[href="https://dailybuddyapp.com"].lg\\:block {
        font-size: 0.75rem !important;
        padding: 0.2rem 0.4rem !important;
        margin-left: 0.25rem !important;
    }

    header nav .container > .flex > .flex-grow {
      min-width: 50px; 
    }
}

/* Utility class for component load errors */
.component-load-error {
    display: block; 
    padding: 1rem;
    text-align: center;
    color: var(--tx-m); /* Muted text color */
    font-style: italic;
    font-size: 0.875rem;
    border: 1px dashed var(--br-s); /* Dashed border */
    border-radius: 0.375rem; /* rounded-md */
    background-color: var(--bg-ca); /* Card-alt background */
    margin-top: 1rem;
}

/* API Key Section */
#apiKeySection {
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
}
#apiKeySection h3 {
    color: var(--tx-s);
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center;
    margin-bottom: 0.5rem;
}
#apiKeySection p {
    color: var(--tx-m);
    font-size: 0.75rem;
    line-height: 1.3;
    margin-bottom: 0.75rem;
    text-align: center;
}
#apiKeySection a {
    color: var(--lnk-c) !important;
    text-decoration: underline;
}
#apiKeySection a:hover {
    color: var(--lnk-ch) !important;
}
#apiKeySection .fi {
    background-color: var(--bg-in);
    color: var(--tx-p);
    border: 1px solid var(--br-s);
    border-radius: 0.25rem;
    padding: 0.375rem 0.6rem;
    font-size: 0.75rem;
}
#apiKeySection .fi:focus {
    border-color: var(--br-f);
    box-shadow: 0 0 0 2px var(--sh-f);
    outline: none;
}
#apiKeySection .bt {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    height: 100%;
}
.bt_pr {
    background-color: var(--bg-bacc);
    color: var(--tx-onacc);
    border-color: var(--bg-bacc);
}
.bt_pr:hover {
    background-color: var(--bg-bacch);
    border-color: var(--bg-bacch);
}
.bt_sc {
    background-color: transparent;
    color: var(--tx-s);
    border: 1px solid var(--br-s);
}
.bt_sc:hover {
    background-color: var(--bg-b);
    border-color: var(--tx-s);
}
#apiKeyStatus.success {
    color: #4ade80; /* A light green color */
}
#apiKeyStatus.error {
    color: #f87171; /* A light red color */
}
#apiKeyStatus.info {
    color: var(--tx-s);
}

/* Special button style for prominent links */
.nBtn-highlight {
    background-color: var(--tx-acc); /* Prominent yellow/amber */
    color: var(--tx-onacc); /* Dark text on accent */
    border: 1px solid var(--tx-acc);
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    transition: background-color .2s, border-color .2s, transform .2s;
    text-decoration: none !important;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.25rem;
}

.nBtn-highlight:hover {
    background-color: var(--bg-bacch); /* Darker yellow/amber on hover */
    border-color: var(--bg-bacch);
    color: var(--tx-onacc);
    transform: translateY(-1px);
}

/* Special button style for mobile menu */
.nLnkM-highlight {
    background-color: var(--bg-ca); /* Card-alt background */
    color: var(--tx-acc); /* Accent yellow text */
    border: 1px solid var(--tx-acc);
    font-weight: 600;
    margin: 0.25rem 1rem;
    border-radius: 0.375rem;
    text-align: center;
    display: block;
    padding: 0.75rem 1rem;
}

.nLnkM-highlight:hover {
    background-color: var(--bg-bacc); /* Prominent yellow/amber on hover */
    color: var(--tx-onacc);
    border-color: var(--bg-bacc);
}
