/* azmini.css - Master Desktop Styles */

* { box-sizing: border-box; }

body, html {
    margin: 0; padding: 0; height: 100vh;
    background-color: gray; color: black;
    overflow: hidden; font-family: 'Century Schoolbook', serif;
}

#main { display: flex; height: calc(100% - 30px); width: 100%; }

/* --- SIDEBAR --- */
nav#side-nav {
    width: 170px; background: #DDDDDD;
    display: flex; flex-direction: column;
    padding: 20px 0; flex-shrink: 0;
    border-right: 1px solid #bbb; z-index: 20;
}

#menulogo { display: block; text-align: center; margin-bottom: 40px; }
#menulogo img { width: 60%; height: auto; }

.brand-title {
    font-family: 'Century Schoolbook', serif;
    font-size: 20pt; text-align: center;
    color: black; font-weight: bold; margin-bottom: 10px;
}

.nav-links-container { margin-top: 50px; padding-left: 25px; text-align: left; }

.menutext a { 
    text-decoration: none !important; color: black; display: block; 
    margin-bottom: 22px; letter-spacing: 1px;
    font-family: Arial, sans-serif; font-variant: small-caps; font-size: 13pt;
}

.menutext a.active { color: #888 !important; }

.nav-dog { margin-top: auto; text-align: center; padding-bottom: 20px; }
.nav-dog img { width: 70%; }

/* --- CONTAINERS & TEXT --- */
.page-container {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 10px; background-color: gray;
}

.original-content-box { margin: auto; width: 60%; text-align: center; }

.main-header {
    font-family: 'Century Schoolbook', serif;
    font-size: 42pt; margin-bottom: 10px;
    letter-spacing: .2em; color: black;
}

.content-text {
    font-family: Arial, sans-serif; font-variant: small-caps;
    font-size: 14pt; line-height: 1.6;
}

.email-link {
    text-transform: lowercase !important;
    font-variant: normal !important;
    font-size: 12pt;
    text-decoration: underline !important;
    color: black;
}

/* --- PORTFOLIO GRID (AZ_home.html) --- */
.gallery-bg { background-color: white !important; }

/* REPAIR: Set to 22.5vh to equal exactly 90% of screen height (22.5 * 4 = 90) */
.grid-master {
    display: grid;
    grid-template-columns: repeat(5, 22.5vh); 
    grid-template-rows: repeat(4, 22.5vh);
    gap: 12px;
}
#bigImageSlot { z-index: 10; transition: all 0.6s ease; background-color: #000; cursor: zoom-in; }
#bigImageSlot img, .thumb-slot img { 
    width: 100%; height: 100%; object-fit: cover; 
    display: block; border: 0.5pt solid #444; 
}

/* --- SHOWS PAGE SPECIFIC --- */
.shows-split { display: flex; width: 92%; height: 70vh; align-items: center; background: gray; overflow: hidden; }

/* REPAIR: Image flex reduced to 1.35 to make image 10% smaller relative to text */
.shows-image { flex: 1.35; height: 100%; display: flex; align-items: center; justify-content: center; }
.shows-image img { width: 100%; height: 100%; object-fit: cover; }
.shows-text-area { flex: 1; padding-left: 50px; text-align: left; }

.show-link-line {
    display: block; text-decoration: none; color: black;
    font-family: Arial, sans-serif; font-variant: small-caps;
    font-size: 14pt; margin-bottom: 20px; line-height: 1.2;
}

/* --- MAGNIFY MODAL --- */
#modalOverlay {
    display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.9); z-index: 1000; justify-content: center; align-items: center; cursor: zoom-out;
}
#modalOverlay img { max-width: 90%; max-height: 90%; border: 1px solid #555; }

/* --- FOOTER --- */
footer#main-footer {
    position: fixed; bottom: 0; left: 0; width: 100%; height: 30px;
    background: #505050; color: white; text-align: right;
    padding: 5px 20px; font-size: 10pt; z-index: 100;
}
footer#main-footer a { color: white; text-decoration: none; }