/* 5.11.45 Folded in from WordPress > Appearance > Additional CSS (styling ChatGPT added there).
   Loaded at the same point in the page as Additional CSS was (right after site-late.css), so everything
   layers exactly as before. Once this version is installed, the Additional CSS box can be emptied.
   Three rules that later rules in the same box cancelled out were dropped (the hidden roundup headline and
   the "Read the full roundup" line under the summary); what readers see is unchanged. */

/* ---------- Live Coverage: one live story -> the bar and the real headline read as one block ---------- */
html body.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) {
 margin: 0 !important; border-bottom: 0 !important; border-radius: 12px 12px 0 0 !important; padding: 14px 16px 0 !important;
}
html body.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) .tbl-live-bar-top { padding: 0 !important; }
html body.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) .tbl-live-tabs { padding: 8px 0 0 !important; }
html body.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) .tbl-live-tab {
 background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important; pointer-events: none;
}
html body.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) .tbl-live-tab b { display: none !important; }
html body.tbl-article.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many):has(+ h1) a.tbl-live-tab.is-on small { color: #c9eedb !important; font-size: 13px !important; }
html body.tbl-article.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many) + h1 {
 box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important;
 position: relative !important; isolation: isolate !important;
 margin: 0 0 18px !important; padding: 26px 26px 28px !important; background: var(--tbl-live, #0f4a37) !important;
 border: 2px solid var(--tbl-live-edge, #3fae7a) !important; border-top: 0 !important; border-radius: 0 0 14px 14px !important;
 box-shadow: 0 5px 14px rgba(15,74,55,.12) !important;
 color: #163f32 !important; font-size: clamp(23px, 4.1vw, 36px) !important; line-height: 1.24 !important; letter-spacing: -.015em !important;
 white-space: normal !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; text-wrap: pretty !important;
}
html body.tbl-article.tbl-article .article-layout > .tbl-live-bar.tbl-live-bar2:not(.is-many) + h1::before {
 content: "" !important; display: block !important; position: absolute !important; inset: 10px 12px 12px !important;
 border-radius: 14px !important; background: linear-gradient(145deg, #fbf6eb, #f0e5d0) !important; border: 2px solid #c6a56b !important;
 box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 3px 8px rgba(0,0,0,.14) !important;
 z-index: -1 !important; pointer-events: none !important;
}
/* one live story: its tab fills the bar and shows the full title */
html body .tbl-live-bar.tbl-live-bar2:not(.is-many) .tbl-live-tabs { min-width: 0; }
html body .tbl-live-bar.tbl-live-bar2:not(.is-many) .tbl-live-tab { box-sizing: border-box; flex: 1 1 100%; width: 100%; max-width: none; min-width: 0; }
html body .tbl-live-bar.tbl-live-bar2:not(.is-many) .tbl-live-tab b { white-space: normal; overflow-wrap: anywhere; text-overflow: clip; }
html body .tbl-live-bar.tbl-live-bar2:not(.is-many) .tbl-live-tabs::after { content: none; }

/* ---------- Phones: the five sections fill the section row ---------- */
@media (max-width: 767px) { #tbl-site-header .tbl-hd-tabs > div { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* ---------- Weekly Roundup: "This Week in Newport" heading and the full-photo card ---------- */
html body .tbl-home .tbl-hs:has(+ .tbl-hc-weekly) > span {
 font-size: 0 !important; text-transform: none !important; letter-spacing: 0 !important; display: inline-flex; align-items: center;
 padding: 9px 15px; border: 1px solid #d5b879; border-radius: 999px; background: #f8f2e5; color: #123b59; box-shadow: 0 2px 8px rgba(11, 40, 58, .08);
}
html body .tbl-home .tbl-hs:has(+ .tbl-hc-weekly) > span::after { content: "This Week in Newport"; font: 800 16px/1.15 var(--hsans, sans-serif); letter-spacing: .01em; text-transform: none; }
html body .tbl-home .tbl-hs:has(+ .tbl-hc-weekly)::after { background: linear-gradient(90deg, #c79a52, rgba(199, 154, 82, .15)); opacity: 1; }
html body .tbl-home .tbl-hc-weekly .tbl-hc-track::after { display: none !important; }
html body .tbl-home .tbl-hc-weekly .tbl-hc-slide {
 position: relative !important; display: flex !important; flex: 0 0 100% !important; flex-direction: column !important; justify-content: flex-end !important; align-items: stretch !important;
 height: clamp(320px, 30vw, 390px) !important; min-height: 300px !important; border: 1px solid rgba(255, 255, 255, .32) !important; border-radius: 16px !important;
 background: #0b2e48 !important; overflow: hidden !important; box-shadow: 0 8px 24px rgba(8, 30, 48, .18);
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-photo {
 position: absolute !important; inset: 0 !important; z-index: 0 !important; flex: none !important; width: 100% !important; height: 100% !important;
 min-height: 0 !important; aspect-ratio: auto !important; background: #0b2e48 !important;
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-photo img, html body .tbl-home .tbl-hc-weekly .tbl-hc-photo video { display: block; width: 100% !important; height: 100% !important; object-fit: cover !important; }
html body .tbl-home .tbl-hc-weekly .tbl-hc-photo::after {
 content: ""; position: absolute; inset: 0; z-index: 1;
 background: linear-gradient(180deg, rgba(6, 26, 42, .02) 12%, rgba(6, 26, 42, .12) 38%, rgba(6, 26, 42, .78) 68%, rgba(6, 26, 42, .96) 100%);
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-body {
 position: relative !important; z-index: 2 !important; display: flex !important; flex: 0 0 auto !important; flex-direction: column !important; justify-content: flex-end !important;
 width: 100% !important; box-sizing: border-box !important; padding: 94px 26px 24px !important; background: none !important; overflow: hidden !important;
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-title {
 position: relative !important; width: auto !important; height: auto !important; padding: 0 !important; margin: 0 0 10px !important; overflow: visible !important;
 clip: auto !important; white-space: normal !important; border: 0 !important; color: #fff !important;
 font: 700 clamp(24px, 3vw, 34px)/1.08 var(--hserif, Georgia, serif) !important; text-shadow: 0 2px 10px rgba(0,0,0,.35) !important;
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-sum {
 display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 4 !important; overflow: hidden !important; margin: 0 !important;
 color: #fff !important; font: 500 17px/1.45 var(--hsans, sans-serif) !important; text-shadow: 0 1px 8px rgba(0, 0, 0, .4);
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-when { margin-top: 11px !important; padding-top: 0 !important; color: #f2d79c !important; font-size: 11px !important; letter-spacing: .1em !important; }
@media (max-width: 782px) {
 html body .tbl-home .tbl-hc-weekly .tbl-hc-slide { height: 320px !important; min-height: 300px !important; }
 html body .tbl-home .tbl-hc-weekly .tbl-hc-body { padding: 100px 16px 19px !important; }
 html body .tbl-home .tbl-hc-weekly .tbl-hc-sum { -webkit-line-clamp: 4 !important; font-size: 15px !important; line-height: 1.42 !important; }
 html body .tbl-home .tbl-hc-weekly .tbl-hc-when { font-size: 10.5px !important; }
 html body .tbl-home .tbl-hs:has(+ .tbl-hc-weekly) > span { padding: 8px 12px; }
 html body .tbl-home .tbl-hs:has(+ .tbl-hc-weekly) > span::after { font-size: 14px; }
 html body .tbl-home .tbl-hc-weekly .tbl-hc-title { margin-bottom: 8px !important; font-size: 25px !important; }
}

/* ---------- "Read full story →" beside the date on every clickable story card ---------- */
html body .tbl-home .tbl-hc-slide .tbl-hc-when { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; width: 100% !important; }
html body .tbl-home .tbl-hc-slide .tbl-hc-when::after {
 content: "Read full story →"; margin-left: auto; white-space: nowrap; color: #d5b879; font: 700 12px/1.2 var(--hsans, sans-serif); letter-spacing: .02em; text-shadow: 0 1px 6px rgba(0,0,0,.35);
}
html body .tbl-home .tbl-hc-weekly .tbl-hc-when::after { content: "Read the full roundup →"; }
@media (max-width: 782px) { html body .tbl-home .tbl-hc-slide .tbl-hc-when::after { font-size: 11px; } }
/* the theme's own homepage cards (shown only if the plugin's homepage can't build) */
html body .news-grid .news-story .label-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
html body .news-grid .news-story .source-date::after {
 content: "Read full story →"; margin-left: 12px; color: #1c5c83; font: 700 11px/1.2 var(--sans, Arial, sans-serif); letter-spacing: .02em; white-space: nowrap;
}
@media (max-width: 782px) { html body .news-grid .news-story .source-date::after { font-size: 10px; margin-left: 8px; } }
/* "More stories" list, compact white cards and feature cards: the same yellow cue */
html body .tbl-home .tbl-ms article .tbl-ms-meta { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; }
html body .tbl-home .tbl-ms article .tbl-ms-meta::after {
 content: "Read full story →"; margin-left: auto; color: #b07d16; font: 800 10px/1.2 var(--hsans, Arial, sans-serif); letter-spacing: .03em; white-space: nowrap;
}
@media (max-width: 782px) { html body .tbl-home .tbl-ms article .tbl-ms-meta::after { font-size: 9px; } }
html body .tbl-home .tbl-hl-when, html body .tbl-home .tbl-hf-when { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; width: 100% !important; }
html body .tbl-home .tbl-hl-when::after, html body .tbl-home .tbl-hf-when::after {
 content: "Read full story →"; margin-left: auto; color: #b07d16; font: 800 10px/1.2 var(--hsans, Arial, sans-serif); letter-spacing: .03em; white-space: nowrap;
}
@media (max-width: 782px) { html body .tbl-home .tbl-hl-when::after, html body .tbl-home .tbl-hf-when::after { font-size: 9px; } }
html body .tbl-home .tbl-hc-weekly .tbl-pill{display:none!important}   /* 1.0.3 the edition name already shows in the heading; the faint label behind the date goes */

/* 1.2.58 card footer: one clean line. A small gold UPDATED label and the date sit together on the left (never wrapping
   onto three lines), "Read full story" on the right. */
html body .tbl-home .tbl-hc-when,html body .tbl-home .tbl-hf-when,html body .tbl-home .tbl-hl-when{flex-wrap:nowrap!important;white-space:nowrap!important;align-items:baseline!important}
html body .tbl-home .tbl-upd{display:inline-flex!important;align-items:center;gap:6px;margin:0 8px 0 0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;color:#ffc72c!important;font:800 10.5px/1 system-ui,-apple-system,sans-serif!important;letter-spacing:.12em!important;vertical-align:baseline!important}
html body .tbl-home .tbl-upd::before{content:"";width:6px;height:6px;border-radius:50%;background:#ffc72c;flex:0 0 6px}
html body .tbl-home .tbl-upd::after{content:"\00B7";margin-left:6px;color:#a9c6dc;font-weight:700}
html body .tbl-home .tbl-hc-when::after,html body .tbl-home .tbl-hf-when::after,html body .tbl-home .tbl-hl-when::after{flex:0 0 auto}
@media (max-width:782px){html body .tbl-home .tbl-hc-when,html body .tbl-home .tbl-hf-when{font-size:10.5px!important;letter-spacing:.08em!important}html body .tbl-home .tbl-upd{font-size:10px!important;margin-right:6px!important}}
