/* ==========================================================
   Gulf Simple design v1 (2026-10-24)
   Same layout, font and spacing as saudilifeguide.com (SLG article design v2),
   colours swapped to the Gulf Simple "UAE Red + Sand" palette (Arslan, 24 Oct 2026).
   Loaded by mu-plugin gs-design.php after the theme CSS, so theme updates never overwrite it.
   ========================================================== */

:root {
  --gs-red: #a6192e;        /* links, table header, buttons, category tags */
  --gs-red-dark: #5c0e1a;   /* headings, hover */
  --gs-red-soft: #fbedef;   /* notes, chips */
  --gs-sand: #c8a24a;       /* H2 bar, TOC and card top border, link underline */
  --gs-ink: #1f1f1f;        /* body text */
  --gs-muted: #666666;      /* captions, meta */
  --gs-line: #ece4e5;       /* borders */
  --gs-cream: #faf7f2;      /* TOC card */
  --gs-row: #fbf7f7;        /* even table rows */
}

/* ---------- Site-wide font: Jost (headers, menus, homepage blocks, footer; icon fonts excluded) ---------- */
:root{--td_default_google_font_1:'Jost',-apple-system,'Segoe UI',sans-serif!important;--td_default_google_font_2:'Jost',-apple-system,'Segoe UI',sans-serif!important}
body :is(h1,h2,h3,h4,h5,h6,p,li,a,span,div,td,th,label,input,button,select,textarea,blockquote,figcaption,time,strong,em):not(i):not([class*="icon"]):not([class*="tdc-font"]):not(.fa):not(svg *){font-family:'Jost',-apple-system,'Segoe UI',sans-serif!important}

/* ---------- Single posts: body text ---------- */
body.single-post .tdb_single_content .tdb-block-inner,
body.single-post .tdb_single_content .tdb-block-inner p,
body.single-post .tdb_single_content .tdb-block-inner li {
  font-family: 'Jost', -apple-system, 'Segoe UI', sans-serif !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: var(--gs-ink);
}
body.single-post .tdb_single_content .tdb-block-inner p { margin-bottom: 22px; }
body.single-post .tdb_single_content .tdb-block-inner li { margin-bottom: 8px; }

/* ---------- Headings ---------- */
body.single-post .tdb_single_content .tdb-block-inner h2,
body.single-post .tdb_single_content .tdb-block-inner h3,
body.single-post .tdb_single_content .tdb-block-inner h4 {
  font-family: 'Jost', sans-serif !important;
  color: var(--gs-red-dark);
  font-weight: 600;
  line-height: 1.3;
  scroll-margin-top: 90px;
}
body.single-post .tdb_single_content .tdb-block-inner h2 {
  font-size: 28px !important;
  margin: 44px 0 18px;
  padding-left: 14px;
  border-left: 4px solid var(--gs-sand);
}
body.single-post .tdb_single_content .tdb-block-inner h3 {
  font-size: 22px !important;
  margin: 32px 0 14px;
}

/* ---------- In-article links ---------- */
body.single-post .tdb_single_content .tdb-block-inner a:not(.wp-block-button__link) {
  color: var(--gs-red);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: rgba(200, 162, 74, .55);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  transition: color .15s ease, text-decoration-color .15s ease;
}
body.single-post .tdb_single_content .tdb-block-inner a:not(.wp-block-button__link):hover {
  color: var(--gs-red-dark);
  text-decoration-color: var(--gs-sand);
}
body.single-post .tdb_single_content a img,
body.single-post .tdb_single_content figure a { text-decoration: none; }

/* ---------- Table of contents: card ---------- */
body.single-post .tdb_single_toc .tdb-block-inner {
  background: var(--gs-cream);
  border: 1px solid var(--gs-line);
  border-top: 4px solid var(--gs-sand);
  border-radius: 10px;
  padding: 20px 24px;
}
body.single-post .tdb_single_toc .tdb-stoc-title {
  font-family: 'Jost', sans-serif !important;
  font-size: 19px !important;
  font-weight: 600;
  color: var(--gs-red-dark) !important;
}
body.single-post .tdb_single_toc a {
  font-family: 'Jost', sans-serif !important;
  font-size: 15.5px !important;
  line-height: 1.5;
  color: var(--gs-ink) !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}
body.single-post .tdb_single_toc a:hover { color: var(--gs-red) !important; text-decoration: underline !important; }
body.single-post .tdb_single_toc li { margin-bottom: 6px; }

/* ---------- Tables ---------- */
body.single-post .tdb_single_content .tdb-block-inner table {
  border-collapse: collapse;
  width: 100%;
  font-size: 16px !important;
  border: 1px solid var(--gs-line) !important;
  border-radius: 8px;
  overflow: hidden;
}
body.single-post .tdb_single_content .tdb-block-inner th {
  background: var(--gs-red);
  color: #fff;
  font-weight: 600;
  text-align: left;
  padding: 12px 14px;
}
body.single-post .tdb_single_content .tdb-block-inner td {
  padding: 11px 14px;
  border: 1px solid var(--gs-line) !important;
}
body.single-post .tdb_single_content .tdb-block-inner th { border: 1px solid var(--gs-red) !important; }
body.single-post .tdb_single_content .tdb-block-inner tbody tr:nth-child(even) td { background: var(--gs-row); }

/* ---------- Quotes / notes ---------- */
body.single-post .tdb_single_content .tdb-block-inner blockquote {
  background: var(--gs-red-soft);
  border-left: 4px solid var(--gs-red);
  border-radius: 0 8px 8px 0;
  padding: 16px 20px;
  font-style: normal;
}

/* ---------- Phones ---------- */
@media (max-width: 767px) {
  body.single-post .tdb_single_content .tdb-block-inner,
  body.single-post .tdb_single_content .tdb-block-inner p,
  body.single-post .tdb_single_content .tdb-block-inner li { font-size: 17px !important; line-height: 1.55 !important; }
  body.single-post .tdb_single_content .tdb-block-inner h2 { font-size: 24px !important; }
  body.single-post .tdb_single_content .tdb-block-inner h3 { font-size: 20px !important; }
  body.single-post .tdb_single_toc .tdb-block-inner { padding: 16px 18px; }
  body.single-post .tdb_single_content .tdb-block-inner table { display: block; overflow-x: auto; font-size: 15px !important; }
}

/* ---------- Tools hub (/tools/) ---------- */
.gs-tools-jump{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 8px}
.gs-tools-jump a{background:var(--gs-red-soft);color:var(--gs-red-dark)!important;border:1px solid #f3d3d8;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:500;text-decoration:none!important}
.gs-tools-jump a:hover{background:var(--gs-red);color:#fff!important}
ul.gs-tools-grid{list-style:none!important;margin:0 0 30px!important;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
ul.gs-tools-grid li{margin:0!important;padding:0!important;list-style:none!important}
ul.gs-tools-grid li::before{display:none!important;content:none!important}
ul.gs-tools-grid a{display:flex;align-items:center;gap:14px;height:100%;background:#fff;border:1px solid var(--gs-line);border-radius:10px;padding:16px 18px;text-decoration:none!important;color:var(--gs-ink)!important;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease}
ul.gs-tools-grid a:hover{border-color:var(--gs-red);box-shadow:0 6px 16px rgba(166,25,46,.12);transform:translateY(-2px)}
ul.gs-tools-grid strong{display:block;font-family:'Jost',sans-serif;font-size:17px;font-weight:600;color:var(--gs-red)!important;margin-bottom:6px;line-height:1.3}
ul.gs-tools-grid span{display:block;font-size:14.5px;line-height:1.5;color:var(--gs-muted)}
.gs-tools-grid .gs-ic{flex:0 0 46px;height:46px;border-radius:10px;background:var(--gs-red-soft);color:var(--gs-red);display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.gs-tools-grid .gs-ic svg{width:24px;height:24px}
.gs-tools-grid a:hover .gs-ic{background:var(--gs-red);color:#fff}
.gs-tools-grid em{font-style:normal;flex:1;min-width:0}
.gs-tools-grid .gs-go{font-style:normal;font-size:24px;color:#c9a3a9;line-height:1}
.gs-tools-grid a:hover .gs-go{color:var(--gs-red)}

/* ---------- Pages: same reading style as posts ---------- */
body.page .td-page-content, body.page .td-page-content p, body.page .td-page-content li{font-family:'Jost',-apple-system,'Segoe UI',sans-serif!important;font-size:18px!important;line-height:1.6!important;color:var(--gs-ink)}
body.page .td-page-content h2, body.page .td-page-content h3, body.page h1.td-page-title{font-family:'Jost',sans-serif!important;color:var(--gs-red-dark);font-weight:600}
body.page .td-page-content h2{font-size:28px!important;margin:40px 0 14px;padding-left:14px;border-left:4px solid var(--gs-sand);line-height:1.3}
body.page .td-page-content h3{font-size:21px!important}
body.page .td-page-content p a, body.page .td-page-content li > a{color:var(--gs-red);font-weight:500;text-decoration:underline;text-decoration-color:rgba(200,162,74,.55);text-decoration-thickness:2px;text-underline-offset:3px}
@media (max-width:767px){body.page .td-page-content p, body.page .td-page-content li{font-size:17px!important;line-height:1.55!important}body.page .td-page-content h2{font-size:24px!important}}

/* ---------- Pages: tables (same look as posts) ---------- */
body.page .td-page-content table{border-collapse:collapse;width:100%;font-size:16px!important;border:1px solid var(--gs-line)!important}
body.page .td-page-content th{background:var(--gs-red)!important;color:#fff!important;font-weight:600;text-align:left;padding:12px 14px;border:1px solid var(--gs-red)!important}
body.page .td-page-content td{padding:10px 14px;border:1px solid var(--gs-line)!important}
body.page .td-page-content tbody tr:nth-child(even) td{background:var(--gs-row)}
body.page .td-page-content figure.wp-block-table{margin:0 0 26px}
body.page .td-page-content figure.wp-block-table figcaption{font-size:14px!important;color:var(--gs-muted);margin-top:8px;line-height:1.5}
@media (max-width:767px){body.page .td-page-content figure.wp-block-table{overflow-x:auto}body.page .td-page-content table{font-size:15px!important}}

/* ---------- Tool pages: centred 820px reading column (add class gs-narrow via the page's body class filter) ---------- */
body.gs-narrow .td-main-sidebar{display:none}
body.gs-narrow .td-main-content{width:100%!important}
body.gs-narrow .td-page-header, body.gs-narrow .entry-crumbs, body.gs-narrow .td-crumb-container, body.gs-narrow .td-page-content{max-width:820px;margin-left:auto!important;margin-right:auto!important}

/* ---------- Mobile header: white, readable logo ---------- */
.td-header-mobile-wrap .tdc_zone > .td-element-style{background:#fff!important}
.td-header-mobile-wrap .tdc_zone{border-bottom:1px solid var(--gs-line)}
.td-header-mobile-wrap .tdb-mobile-menu-icon, .td-header-mobile-wrap .tdb-header-search-button-mob i, .td-header-mobile-wrap [class*="td-icon-search"]{color:var(--gs-red-dark)!important}
.td-header-mobile-wrap .tdb-logo-img{max-height:44px!important;width:auto!important}
.td-header-mobile-sticky-wrap .tdc_zone, .td-header-mobile-sticky-wrap .tdc_zone > .td-element-style{background:#fff!important}
.td-header-mobile-sticky-wrap .tdc_zone{border-bottom:1px solid var(--gs-line)}
.td-header-mobile-sticky-wrap .tdb-mobile-menu-icon, .td-header-mobile-sticky-wrap .tdb-header-search-button-mob i, .td-header-mobile-sticky-wrap [class*="td-icon-search"]{color:var(--gs-red-dark)!important}
.td-header-mobile-sticky-wrap .tdb-logo-img{max-height:44px!important;width:auto!important}

/* ---------- Single posts: Updated date next to the published date ---------- */
.tdb_single_modified_date{margin-left:12px!important}
.tdb_single_modified_date .tdb-block-inner{font-size:13px!important;color:var(--gs-red)!important;font-weight:500}
.tdb_single_modified_date .tdb-block-inner span{color:var(--gs-muted);font-weight:400}

/* ---------- Mobile tables: block and plain tables scroll sideways, words never split ---------- */
@media (max-width:767px){
.td-post-content figure.wp-block-table,body.page .td-page-content figure.wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
.td-post-content .wp-block-table table,body.page .td-page-content .wp-block-table table{table-layout:auto!important;width:100%}
.td-post-content table,body.page .td-page-content table{table-layout:auto!important;width:100%;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.td-post-content table th,.td-post-content table td,body.page .td-page-content table th,body.page .td-page-content table td{word-break:normal!important;overflow-wrap:normal!important;hyphens:none!important;padding:10px 12px!important;font-size:15px!important;line-height:1.45;min-width:88px}
.td-post-content table th:first-child,.td-post-content table td:first-child,body.page .td-page-content table th:first-child,body.page .td-page-content table td:first-child{min-width:96px}
.td-post-content figure.wp-block-table table{display:table}
}

/* ---------- Brand colour on theme blocks (SLG brand-colours rules, UAE red) ---------- */
.td-main-content-wrap .td_block_template_1 .td-block-title>*{background-color:var(--gs-red)!important;color:#fff!important}
.td-main-content-wrap .td_block_template_1 .td-block-title{border-bottom-color:var(--gs-red)!important}
.td-main-content-wrap .td_block_wrap:not(.td-big-grid-flex-posts) .td-post-category{background-color:var(--gs-red)!important;color:#fff!important}
body .td-main-content-wrap .tdb-category a.tdb-entry-category{display:inline-block;background-color:var(--gs-red)!important;color:#fff!important;padding:5px 9px 4px!important;border-radius:3px}
.td-main-content-wrap .td_block_wrap:not(.td-big-grid-flex-posts) .td-module-container:hover .td-post-category{background-color:var(--gs-red-dark)!important}
body .td-main-content-wrap .tdb-category a.tdb-entry-category:hover{background-color:var(--gs-red-dark)!important;color:#fff!important}
.td-main-content-wrap .td-module-comments a{background-color:var(--gs-red)!important}
.td-main-content-wrap .td-module-comments a:after{border-color:var(--gs-red) transparent transparent transparent!important}
.td-main-content-wrap .td-read-more a{background-color:var(--gs-red)!important;color:#fff!important}
.td-main-content-wrap .td-read-more a:hover{background-color:var(--gs-red-dark)!important}