/*
 Theme Name: Micro Galleries of Long Beach
 Theme URI: https://38thweb.com/
 Description: Child theme for Hello Elementor. Customized styles for Micro Galleries of Long Beach.
 Author: 38thweb.com
 Author URI: https://38thweb.com/
 Template: hello-elementor
 Version: 1.0.0
 Text Domain: micro-galleries-of-long-beach
*/

/* IMPORTANT:
 - Do NOT use @import. Parent styles are enqueued via PHP in functions.php.
 - Keep this file minimal; add large component CSS in separate files if desired (e.g., assets/css/gallery.css).
*/

/* ====== Theme variables (customize for the site) ====== */
:root{
   --site-max-width: 1200px;
   --content-width: 1140px;
   --gutter: 16px;

   --color-primary: #0b5b8a; /* deep-sea blue */
   --color-accent: #e67f3c;  /* warm accent */
   --color-muted: #6b7280;
   --color-bg: #ffffff;
   --color-text: #1f2937;

   --font-base: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
   --font-size-base: 16px;
   --line-height-base: 1.45;

   --gallery-gap: 12px;
}

/* Basic resets / accessible defaults */
html{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;color:var(--color-text);background:var(--color-bg);font-family:var(--font-base);font-size:var(--font-size-base);line-height:var(--line-height-base)}

a{color:var(--color-primary);text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* Screen-reader helper */
.visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;border:0;padding:0;margin:-1px}

/* Accessible focus styles */
:focus{outline:3px solid color-mix(in srgb, var(--color-primary) 30%, white);outline-offset:3px}

/* Layout helpers */
.container{max-width:var(--site-max-width);margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.row{display:flex;flex-wrap:wrap;margin-left:-8px;margin-right:-8px}
.col{padding-left:8px;padding-right:8px}

/* Typography */
h1,h2,h3,h4,h5,h6{color:var(--color-text);margin:0 0 .5rem;font-weight:600}
p{margin:0 0 1rem}

/* Buttons (simple utility for links used as buttons) */
.btn{display:inline-block;padding:.5rem 1rem;background:var(--color-primary);color:#fff;border-radius:4px;text-decoration:none}
.btn--outline{background:transparent;color:var(--color-primary);border:1px solid var(--color-primary)}

/* Note: Gallery component CSS moved to assets/css/gallery.css and is enqueued separately. */

/* Utility spacing classes (small set) */
.mt-1{margin-top:.25rem}
.mt-2{margin-top:.5rem}
.mt-3{margin-top:1rem}
.mb-1{margin-bottom:.25rem}
.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:1rem}

/* Responsive breakpoints */
@media (max-width: 900px){
   :root{--site-max-width:960px}
}
@media (max-width: 600px){
   :root{--site-max-width:100%}
}

/* Developer: Add component-specific CSS in /assets/css and enqueue from functions.php for better cache control. */

/*.  Home Page */

.site-logo {
	max-width:25%;
}
main {
	min-height:40em;
}

/* Master Map Page */

#mgolb-master-map {
        width: 100%;
        height: 700px;
        margin: 40px auto;
        border-radius: 6px;
    }