/* DOC: AI_Quick_Analysis.txt */

/* =============================
   Container
============================= */
.ai-quick-analysis {
    background: #222;
    border: 1px solid #444;
    padding: 15px;
    margin: 20px 0;
    border-radius: 6px;
    color: #ddd;
}

.ai-quick-analysis h3,
.ai-quick-analysis h4 {
    color: #eee;
    margin-top: 0;
    border-bottom: 1px solid #333;
    padding-bottom: 6px;
}

/* =============================
   Basic rows
============================= */
.ai-row {
    margin-bottom: 6px;
    display: flex;
    flex-wrap: wrap;
    font-size: 0.95rem;
}

.ai-label {
    font-weight: bold;
    margin-right: 6px;
    color: #9acd32;
    width: 140px;
}

.ai-value {
    flex: 1;
    color: #fff;
}

/* =============================
   Sections
============================= */
.ai-section {
    margin-top: 12px;
}

.ai-link a {
    color: #9acd32;
    text-decoration: underline;
}

/* =============================
   Color Bar Layout
============================= */
.ai-colors {
    margin-top: 10px;
}

.ai-color-bar {
    height: 12px;
    margin: 4px 0;
    background: #444;
    border-radius: 3px;
    overflow: hidden;
}

.ai-color-bar-fill {
    height: 100%;
    transition: width 0.3s ease;
}
:root {
    --ai-color-deep-green:   #1a3f1a;
    --ai-color-light-green:  #5c7f3a;
    --ai-color-dark-earth:   #4b351e;
    --ai-color-light-earth:  #b4956b;
    --ai-color-rock:         #6f6f6f;
    --ai-color-shadow:       #1c1c1c;
    --ai-color-open:         #dcd2b0;
}
.ai-color-swatch {
    width: 30px;
    height: 14px;
    border-radius: 2px;
    display:inline-block;
    margin-right:6px;
}

/* Dynamic gradient placeholders (better than flat) */
.ai-color-swatch.dark-earth {
    background: linear-gradient(90deg,#302315,#705338);
}
.ai-color-swatch.rock {
    background: linear-gradient(90deg,#3f3f3f,#7c7c7c);
}
.ai-color-swatch.light-earth {
    background: linear-gradient(90deg,#7c6236,#e6d3a4);
}
.ai-color-swatch.deep-green {
    background: linear-gradient(90deg,#2d402a,#526b3b);
}
.ai-color-swatch.light-green {
    background: linear-gradient(90deg,#456428,#9fb975);
}
.ai-color-swatch.shadow {
    background: linear-gradient(90deg,#111,#444);
}
.ai-color-swatch.open {
    background: linear-gradient(90deg,#d6ceb0,#f4ead3);
}
/* Center wrapper */
/* Mobile-first full width, desktop capped */
.ai-quick-wrapper {
    width: 100%;
    max-width: 600px;   /* desktop cap */
    margin: 0 auto;
    padding: 0 15px;    /* mobile breathing room */
}

/* The block panel */
#ai-quick-analysis {
    background:#3e3e3e;
    border:1px solid #555;
    border-radius:8px;
    padding:20px;
    color:#eee;
    margin: 20px;
}

/* Optional center headings */
#ai-quick-analysis h3 {
    text-align:center;
}
/* Quick AI Analysis link */
.pattern-ai-btn {
    display:inline-block;
    padding:6px 12px;
    background:#333;
    border:1px solid #555;
    border-radius:4px;
    font-size:0.9rem;
    color:#ddd !important;
    text-decoration:none;
    cursor:pointer;
}

.pattern-ai-btn:hover {
    background:#444;
    border-color:#777;
}
.pattern-ai-btn.secondary {
    background:#2a2a2a;
    border-color:#555;
}
.pattern-ai-btn.secondary:hover {
    background:#393939;
}
.ai-disclaimer {
    font-size: 0.75rem;
    color: #888;
    margin-top: 12px;
    font-style: italic;
}