/*
Theme Name: Ultra Mobile News
Theme URI: https://example.com/ultra-mobile-news
Author: Your Name
Author URI: https://example.com
Description: Mobile-first, AMP-ready, ultra-fast theme with SEO, CLS/LCP optimizations, and responsive controls per device.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: ultra-mobile-news
Tags: blog, news, mobile-first, accessibility-ready, editor-style, custom-logo
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* Minimal base resets and variables – detailed editor styles in theme.json */
:root {
  --ultra-text-scale: 1; /* modified by plugin resizer */
}

html { font-size: clamp(15px, 0.98vw + 10px, 18px); }
body { margin:0; }

/* Full-screen mobile menu base (AMP-safe by default) */
.ultra-mobile-menu-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); opacity: 0; visibility: hidden; transition: opacity .2s ease; }
.ultra-mobile-menu { position: fixed; inset: 0 0 0 25%; max-width: 480px; margin-left: auto; background: #fff; color: #111; transform: translateX(100%); transition: transform .2s ease; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.ultra-mobile-menu--open .ultra-mobile-menu-overlay { opacity: 1; visibility: visible; }
.ultra-mobile-menu--open .ultra-mobile-menu { transform: translateX(0); }

/* Quick access horizontal nav */
.qax { display: flex; gap: .75rem; overflow-x: auto; padding: .5rem 1rem; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.qax a { white-space: nowrap; scroll-snap-align: start; padding: .5rem .75rem; border-radius: .5rem; background: #f5f5f7; color:#111; text-decoration: none; }
.qax::-webkit-scrollbar { height: 6px; }
.qax::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }

/* Device utilities (also provided by plugin CSS) */
.only-desktop{ display: none; }
.only-tablet{ display: none; }
.only-mobile{ display: block; }
@media (min-width: 641px){ .only-mobile{ display:none;} .only-tablet{ display:block;} }
@media (min-width: 1025px){ .only-tablet{ display:none;} .only-desktop{ display:block;} }

/* Gutenberg: Featured Image ratio helpers */
.wp-block-post-featured-image.is-style-ratio-1x1 img{ aspect-ratio:1/1; object-fit:cover; width:100%; height:auto; }
.wp-block-post-featured-image.is-style-ratio-4x3 img{ aspect-ratio:4/3; object-fit:cover; width:100%; height:auto; }
.wp-block-post-featured-image.is-style-ratio-16x9 img{ aspect-ratio:16/9; object-fit:cover; width:100%; height:auto; }
.wp-block-post-featured-image.is-style-ratio-2x3 img{ aspect-ratio:2/3; object-fit:cover; width:100%; height:auto; }

/* Gutenberg: Post Template columns (mobile-first) */
.wp-block-post-template[class*="is-style-ultra-cols-"]{ display:grid; grid-template-columns:1fr; gap:.75rem; }
@media (min-width: 641px){
  .wp-block-post-template.is-style-ultra-cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
  .wp-block-post-template.is-style-ultra-cols-3{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
  .wp-block-post-template.is-style-ultra-cols-4{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
  .wp-block-post-template.is-style-ultra-cols-5{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:1rem; }
  .wp-block-post-template.is-style-ultra-cols-6{ grid-template-columns:repeat(6,minmax(0,1fr)); gap:1rem; }
  .wp-block-post-template.is-style-ultra-cols-7{ grid-template-columns:repeat(7,minmax(0,1fr)); gap:1rem; }
}

/* Gutenberg: Carousel (horizontal scroll) */
.wp-block-post-template.is-style-ultra-carousel{ display:flex; gap:.75rem; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:.25rem; }
.wp-block-post-template.is-style-ultra-carousel > li{ flex:0 0 85%; scroll-snap-align:start; }
@media (min-width: 641px){ .wp-block-post-template.is-style-ultra-carousel > li{ flex-basis:45%; } }
@media (min-width: 1025px){ .wp-block-post-template.is-style-ultra-carousel > li{ flex-basis:30%; } }

/* Gutenberg: Group horizontal scroll */
.wp-block-group.is-style-ultra-hscroll{ display:flex; gap:.75rem; overflow-x:auto; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
.wp-block-group.is-style-ultra-hscroll > *{ white-space:nowrap; scroll-snap-align:start; }

/* Layouts: one or two sidebars */
.layout-one-sidebar .wrap{ max-width:1200px; margin:0 auto; padding:1rem; display:grid; grid-template-columns:1fr; gap:1rem; }
.layout-two-sidebars .wrap{ max-width:1200px; margin:0 auto; padding:1rem; display:grid; grid-template-columns:1fr; gap:1rem; }
.layout-one-sidebar .site-main{ order:1; }
.layout-one-sidebar .sidebar{ order:2; }
.layout-two-sidebars .sidebar--left{ order:1; }
.layout-two-sidebars .site-main{ order:2; }
.layout-two-sidebars .sidebar--right{ order:3; }
@media (min-width:1025px){
  .layout-one-sidebar .wrap{ grid-template-columns: 3fr 1fr; align-items:start; }
  .layout-two-sidebars .wrap{ grid-template-columns: 1fr 2fr 1fr; align-items:start; }
}

/* Basic widget styling */
.widget{ background:#fff; border:1px solid #e5e7eb; border-radius:.5rem; padding:1rem; }
.widget-title{ margin:0 0 .5rem; font-size:1rem; }

/* Sticky header */
.site-header.is-sticky{ position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid #e5e7eb; }

/* Breaking ticker */
.breaking-ticker{ background:#111; color:#fff; font-size:.95rem; }
.breaking-ticker .wrap{ max-width:1200px; margin:0 auto; padding:.25rem 1rem; display:flex; align-items:center; gap:.75rem; }
.breaking-ticker__label{ background:#b91c1c; color:#fff; padding:.25rem .5rem; border-radius:.25rem; font-weight:600; }
.breaking-ticker__marquee{ overflow:hidden; flex:1; }
.breaking-ticker__items{ display:flex; gap:2rem; white-space:nowrap; animation:ticker-scroll 30s linear infinite; padding:0; margin:0; list-style:none; }
.breaking-ticker__items a{ color:#fff; text-decoration:none; }
.breaking-ticker__items:hover{ animation-play-state:paused; }
@keyframes ticker-scroll{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-100%); } }

/* Home hero */
.home-hero__grid{ max-width:1200px; margin:0 auto; padding:1rem; display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:1025px){ .home-hero__grid{ grid-template-columns:2fr 1fr; } }
.home-hero__side{ display:grid; gap:1rem; }
.card-title a{ text-decoration:none; color:inherit; }

/* Category sections */
.home-section{ padding:.5rem 1rem; }
.home-section .wrap{ max-width:1200px; margin:0 auto; }
.home-section__header{ display:flex; align-items:center; justify-content:space-between; margin:.5rem 0; }
.section-cards{ display:flex; gap:.75rem; overflow-x:auto; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; padding-bottom:.25rem; }
.section-cards article{ flex:0 0 85%; max-width:85%; scroll-snap-align:start; }
@media (min-width:641px){ .section-cards article{ flex-basis:45%; max-width:45%; } }
@media (min-width:1025px){ .section-cards article{ flex-basis:30%; max-width:30%; } }
