/*
Theme Name: Pic2Gen Theme
Author: Your Name
Description: A custom theme for the Pic2Gen AI Tool, based on the Blogger design.
Version: 1.0
*/

/* --- MAIN THEME CSS --- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Orbitron:wght@500;700;900&family=Montserrat:wght@400;500;700&display=swap');
:root {
    --font-body: 'Montserrat', sans-serif;
    --font-heading: 'Orbitron', sans-serif;
    --font-accent: 'Poppins', sans-serif;
    --color-text: #E0E0E0;
    --color-text-dark: #333;
    --color-bg-dark: #121212;
    --color-bg-surface: #1E1E1E;
    --color-bg-surface-hover: #2a2a2a;
    --rainbow-gradient: linear-gradient(90deg, #FF3B30, #FF9500, #FFCC00, #34C759, #007AFF, #5856D6, #AF52DE);
    --rainbow-gradient-animated: linear-gradient(90deg, #FF3B30, #FF9500, #FFCC00, #34C759, #007AFF, #5856D6, #AF52DE, #FF3B30, #FF9500);
    --primary-accent-glow: #00A9FF;
    --secondary-accent-glow: #AF52DE;
    --tertiary-accent-glow: #34C759;
    --border-radius-sharp: 3px;
    --border-radius-medium: 8px;
    --box-shadow-soft: 0 4px 15px rgba(0,0,0,0.2);
    --box-shadow-inset: inset 0 0 10px rgba(0,0,0,0.3);
    --success-color: #28a745;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--font-body); background-color: var(--color-bg-dark); color: var(--color-text); line-height: 1.7; font-size: 16px; overflow-x: hidden; }
.container-fluid { width: 100%; }
.container { max-width: 1140px; margin: 0 auto; padding: 0 15px; }
.container-large { max-width: 1320px; margin: 0 auto; padding: 0 15px; }
a { color: var(--primary-accent-glow); text-decoration: none; transition: color 0.3s ease, opacity 0.3s ease; }
a:hover { color: var(--text-light); opacity: 0.8; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; border-radius: var(--border-radius-medium); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); margin-bottom: 0.75em; font-weight: 700; line-height: 1.3; }
h1 { font-size: 2.5em; letter-spacing: 1px; } h2 { font-size: 2em; } h3 { font-size: 1.6em; }
.text-rainbow { background: var(--rainbow-gradient-animated); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; animation: rainbow-text-animation 10s ease infinite; background-size: 300% 100%; }
@keyframes rainbow-text-animation{ 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
.btn { display: inline-block; font-family: var(--font-accent); font-weight: 600; color: #fff; text-align: center; vertical-align: middle; cursor: pointer; user-select: none; background-color: transparent; border: 2px solid var(--primary-accent-glow); padding: .7rem 1.5rem; font-size: 1rem; line-height: 1.5; border-radius: var(--border-radius-medium); transition: all .3s ease; position: relative; overflow: hidden; z-index: 1; }
.btn:before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(120deg, transparent, rgba(255,255,255,0.2), transparent); transition: all .5s ease; z-index: -1; }
.btn:hover:before { left: 100%; }
.btn:hover { color: #fff; border-color: var(--primary-accent-glow); box-shadow: 0 0 15px var(--primary-accent-glow), 0 0 5px var(--primary-accent-glow) inset; transform: translateY(-2px); }
.btn-success { background-color: var(--success-color); border-color: var(--success-color); }
.btn-success:hover { background-color: #1e7e34; border-color: #1c7430; }
.btn-rainbow { border: none; padding: calc(.7rem + 2px) calc(1.5rem + 2px); background: var(--rainbow-gradient-animated); background-size: 300% 100%; animation: rainbow-button-animation 8s ease infinite; color: #fff; text-shadow: 1px 1px 2px rgba(0,0,0,0.3); }
.btn-rainbow:hover { box-shadow: 0 0 20px rgba(255,255,255,0.3); animation-play-state: paused; }
@keyframes rainbow-button-animation{ 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
.site-header { background-color: rgba(18, 18, 18, 0.85); backdrop-filter: blur(10px); color: #fff; padding: 0.8em 0; box-shadow: 0 2px 10px rgba(0,0,0,0.3); position: fixed; top: 0; left:0; width:100%; z-index: 1000; border-bottom: 1px solid rgba(255,255,255,0.1); transition: transform 0.4s ease-out, opacity 0.4s ease-out; transform: translateY(0); opacity: 1; }
.site-header.header-hidden-on-scroll { transform: translateY(-100%); opacity: 0; }
.site-header .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.site-title a { font-family: var(--font-heading); font-weight: 900; color: #fff; font-size: 1.8em; text-decoration: none; letter-spacing: 1px; }
.site-title .text-rainbow { font-size: inherit; }
.main-nav ul { list-style-type: none; display: flex; flex-wrap: wrap; justify-content: center; margin:0; padding:0; }
.main-nav li a { font-family: var(--font-accent); color: #fff; padding: 0.6em 0.8em; display: block; text-decoration: none; font-weight: 500; border-radius: var(--border-radius-sharp); transition: background-color 0.3s ease, color 0.3s ease; position: relative; font-size: 0.9rem; }
.main-nav li a:after { content: ''; position: absolute; width: 0; height: 2px; display: block; margin-top: 3px; right: 0; background: var(--rainbow-gradient); transition: width .3s ease; }
.main-nav li a:hover:after, .main-nav li.current-menu-item a:after { width: 100%; left: 0; }
.hero-section { background: var(--color-bg-dark) url('https://images.unsplash.com/photo-1620121684840-1ff227761650?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center / cover; background-color: var(--color-bg-dark); padding: 5em 0; text-align: center; position: relative; overflow: hidden; }
.hero-section:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(18,18,18,0.75); z-index: 1; }
.hero-section .container { position: relative; z-index: 2; }
.hero-section h1 { margin-bottom: 0.3em; font-size: 3em; font-weight: 900; text-shadow: 0 0 15px rgba(0,0,0,0.5); }
.hero-section .subtitle { font-family: var(--font-accent); font-size: 1.3em; color: #ddd; max-width: 800px; margin: 0 auto 2em auto; font-weight: 300; }
.hero-section .cta-button { margin-top: 1em; font-size: 1.2em; padding: 0.9em 2.2em; }
.main-content-area { padding: 0; }
.content-section { padding: 3em 0; }
.content-section:nth-child(even) { background-color: var(--color-bg-surface); }
.content-section h2.section-title { text-align:center; margin-bottom:1.5em; font-size: 2.5em; }
.page-content, .post-content, .post { background-color: var(--color-bg-surface); padding: 1.5em; border-radius: var(--border-radius-medium); box-shadow: var(--box-shadow-soft), var(--box-shadow-inset); border: 1px solid rgba(255,255,255,0.05); margin-bottom:1.5em; }
.page-title { margin-bottom: 1em; padding-bottom: 0.5em; border-bottom: 1px solid; border-image-slice: 1; border-image-source: var(--rainbow-gradient); font-size: 2em; }
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; margin-top: 2em; }
.feature-item { background-color: var(--color-bg-surface-hover); padding: 2em; border-radius: var(--border-radius-medium); text-align:center; box-shadow: var(--box-shadow-soft); transition: transform 0.3s ease, box-shadow 0.3s ease; }
.feature-item:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.25); }
.feature-item img.feature-icon { width:100%; max-width:300px; height: 200px; object-fit:cover; margin-bottom: 1em; border: 3px solid var(--primary-accent-glow); padding:5px; }
.feature-item h3 { font-family: var(--font-accent); font-size: 1.4em; color: var(--primary-accent-glow); margin-bottom: 0.5em;}
.feature-item p { font-size: 0.95em; color: #bbb; }
.gallery-section h2.section-title { margin-top:1em; }
.example-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.example-image { overflow: hidden; border-radius: var(--border-radius-medium); box-shadow: var(--box-shadow-soft); background-color:var(--color-bg-surface-hover); }
.example-image img { width:100%; height:220px; object-fit:cover; display:block; transition: transform 0.3s ease; }
.example-image img:hover { transform: scale(1.05); }
.example-image p { text-align:center; padding: 0.8em; font-size:0.9em; color: #ccc; margin:0; }
.testimonials-section { }
.testimonial { background-color: var(--color-bg-surface-hover); border-left: 5px solid; border-image-slice: 1; border-image-source: var(--rainbow-gradient); padding: 1.5em; margin-bottom: 1.5em; border-radius: 0 var(--border-radius-medium) var(--border-radius-medium) 0; }
.testimonial p.quote { font-style: italic; color: #ddd; margin-bottom: 0.5em; }
.testimonial p.author { text-align:right; font-weight: bold; color: var(--primary-accent-glow); }
.free-unlimited-section { padding: 2.5em 0; background: var(--rainbow-gradient-animated); background-size: 200% 200%; animation: rainbow-bg-animation 15s ease infinite; text-align:center; }
@keyframes rainbow-bg-animation { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
.free-unlimited-section h2 { color: #fff; font-size: 2.2em; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); margin-bottom:0.5em; }
.free-unlimited-section p { color: #fff; font-size: 1.2em; font-family: var(--font-accent); font-weight:500; text-shadow: 1px 1px 2px rgba(0,0,0,0.3); }
.search-bar-area { padding: 2em 0; background-color: var(--color-bg-surface); margin: 2.5em 0; }
.search-bar-area .container { text-align: center; }
.search-form { display: flex; justify-content: center; max-width:600px; margin:0 auto; }
.search-form input[type="text"] { font-family: var(--font-accent); padding: 0.8em 1em; flex-grow:1; background-color: #2f2f2f; color: var(--color-text); border: 1px solid #444; border-right: none; border-radius: var(--border-radius-medium) 0 0 var(--border-radius-medium); font-size: 0.95em; outline: none; }
.search-form input[type="text"]:focus { border-color: var(--primary-accent-glow); box-shadow: 0 0 0 2px rgba(0,122,255,0.3); }
.search-form input[type="submit"] { font-family: var(--font-accent); padding: 0.8em 1.2em; background-color: var(--primary-accent-glow); color: white; border: 1px solid var(--primary-accent-glow); border-radius: 0 var(--border-radius-medium) var(--border-radius-medium) 0; cursor: pointer; font-size: 0.95em; font-weight: 600; transition: background-color 0.3s ease; }
.search-form input[type="submit"]:hover { background-color: #005bb5; }
.site-footer { background-color: #0A0A0A; color: #888; padding: 2.5em 0; margin-top: 0; font-size: 0.9em; border-top: 1px solid #222; }
.site-footer .container { text-align: center; }
.footer-nav ul { list-style-type: none; margin: 0 0 1em 0; padding:0; }
.footer-nav li { display: inline-block; margin: 0 0.7em; }
.footer-nav li a { color: #aaa; font-family: var(--font-accent); font-weight: 500;}
.footer-nav li a:hover { color: #fff; }
.copyright { font-size: 0.85em; }
.ad-container { margin: 20px auto; text-align:center; max-width:100%; overflow:hidden; clear:both; }
.post-body img, .page-content img { margin: 1.5em auto; display: block; border-radius: var(--border-radius-sharp); box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
@media (max-width: 992px) { .container, .container-large { padding: 0 10px; } h1 { font-size: 2.2em; } .hero-section h1 { font-size: 2.5em; } h2 { font-size: 1.8em; } .hero-section .subtitle { font-size: 1.1em; } .main-nav ul { justify-content: center; } .features-grid {grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));} .example-gallery {grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));} }
@media (max-width: 768px) { .site-header .container { flex-direction: column; } .site-title { margin-bottom: 0.5em; text-align: center; width:100%;} .main-nav { width:100%; } .main-nav ul { flex-direction: column; align-items: center; width:100%;} .main-nav li { display: block; width:100%; text-align:center; margin: 2px 0;} .main-nav li a { padding: 0.8em 0.5em; font-size: 0.9em; justify-content: center; } .main-nav li a:after { display:none; } h1 { font-size: 2em; } .hero-section h1 { font-size: 2.2em; } .hero-section .subtitle { font-size: 1em; } .hero-section .cta-button { font-size: 1em; padding: 0.7em 1.5em; } .page-content, .post-content { padding: 1.5em 1em; } .content-section { padding: 2em 0;} .content-section h2.section-title { font-size: 2em;} .search-form input[type="text"] { width: 65%; font-size:0.9em; } .search-form input[type="submit"] { font-size:0.9em; padding: 0.8em 1em;} .features-grid, .example-gallery {grid-template-columns: 1fr;} }
@media (max-width: 480px) { h1 { font-size: 1.8em; } .hero-section h1 { font-size: 2em; } .hero-section .subtitle { font-size: 0.9em; } .site-title a { font-size: 1.5em; } .main-nav li a { font-size: 0.85em; } .btn, .btn-rainbow { font-size: 0.9rem; padding: .6rem 1.2rem; } .hero-section .cta-button { font-size: 0.95em; padding: 0.7em 1.2em; } .content-section h2.section-title { font-size: 1.8em;} }

/* --- AI TOOL PAGE CSS --- */
.page-template-template-tool .main-content-area, .ai-tool-page-container { background-color: #1E1E1E; }
.ai-tool-page-container .container{ background:#1E1E1E; padding:25px 30px; border-radius:0; box-shadow:0 5px 15px rgba(0,0,0,.2); width:100%; text-align:center; box-sizing: border-box; display: flex; flex-direction: column; }
.ai-tool-page-container .content-wrapper { width: 100%; max-width: 900px; margin: 0 auto; padding: 20px; box-sizing: border-box; }
.ai-tool-page-container h1#appTitle{font-family:var(--font-heading);font-size:2.8em;font-weight:700;margin-bottom:5px;margin-top: 20px; background:linear-gradient(90deg, #007AFF, #5856D6, #AF52DE, #FF3B30, #FF9500);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-fill-color:transparent;animation:rainbow-text-animation 10s ease infinite;background-size:300% 100%}
.ai-tool-page-container .subtitle{font-size:.9em;color:#a0a0c0;margin-bottom:30px;max-width:90%;margin-left:auto;margin-right:auto}
.ai-tool-page-container .input-section-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.ai-tool-page-container .input-group{text-align:left;background:rgba(0,0,0,.1);padding:15px;border-radius:12px;border:1px solid rgba(255,255,255,.05)}
.ai-tool-page-container label{display:block;margin-bottom:10px;font-size:.95em;color:#a0a0c0;font-weight:500}
.ai-tool-page-container textarea#promptInput{width:calc(100% - 24px);min-height:120px;padding:12px;border-radius:8px;border:1px solid #4a4e69;background-color:#22223b;color:#f0f0f0;font-size:1em;font-family:var(--font-body);transition:border-color .3s,box-shadow .3s;resize:vertical;margin-bottom:10px}
.ai-tool-page-container textarea#promptInput:focus{outline:0;border-color:var(--primary-accent-glow);box-shadow:0 0 0 3px rgba(0,122,255,.3)}
.ai-tool-page-container .quick-prompts-container { margin-bottom: 15px; text-align: left; }
.ai-tool-page-container .quick-prompts-title { font-size: 1em; margin-bottom: 10px; font-weight: 600; }
.ai-tool-page-container .quick-prompts-title strong { background:linear-gradient(90deg, #007AFF, #5856D6, #AF52DE, #FF3B30, #FF9500, #FFCC00); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; text-fill-color:transparent; animation: rainbow-text-animation 10s ease infinite; background-size: 200% 100%; font-weight: 700; }
.ai-tool-page-container .quick-prompts-scrollarea { display: flex; flex-wrap: wrap; padding-bottom: 0px; gap: 8px; align-items: center; }
.ai-tool-page-container .quick-prompts-scrollarea button { padding: 8px 12px; font-size: 0.85em; color: #ffffff; background: linear-gradient(135deg, #007AFF, #AF52DE); border: none; border-radius: 6px; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.3s ease; white-space: nowrap; box-shadow: 0 2px 4px rgba(0,0,0,0.2); line-height: 1.4; flex-grow: 0; }
.ai-tool-page-container .quick-prompts-scrollarea button:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 4px 10px rgba(0,0,0,0.3); background: linear-gradient(135deg, #5856D6, #FF3B30); }
.ai-tool-page-container .file-input-area{display:flex;flex-direction:column;align-items:center;gap:10px;padding:15px;border:2px dashed #4a4e69;border-radius:8px;background-color:rgba(0,0,0,.05);min-height:250px; justify-content:center}
.ai-tool-page-container .file-input-label{background:linear-gradient(45deg,var(--primary-accent-glow),var(--secondary-accent-glow));color:#fff;padding:10px 18px;border-radius:20px;cursor:pointer;font-weight:600;font-size:.9em;transition:all .3s ease;box-shadow:0 2px 5px rgba(0,0,0,.2)}
.ai-tool-page-container .file-input-label:hover{transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.3)}
.ai-tool-page-container .file-input{display:none}
.ai-tool-page-container .image-preview-container{display:flex;align-items:center;gap:8px;margin-top:10px}
.ai-tool-page-container .image-preview{max-width:150px;max-height:150px; border-radius:6px;border:1px solid #555;display:none;object-fit:contain}
.ai-tool-page-container .remove-image-button{background:#FF3B30;color:#fff;border:none;border-radius:50%;width:24px;height:24px;font-size:14px;cursor:pointer;display:none;line-height:24px;text-align:center;font-weight:700}
.ai-tool-page-container .file-name-display{font-size:.8em;color:#a0a0c0;margin-top:5px;word-break:break-all}
.ai-tool-page-container button#generateButton{background:var(--rainbow-gradient-animated);background-size:300% 100%;color:#fff;border:none;padding:16px 35px;border-radius:30px;font-size:1.15em;font-weight:700;font-family:var(--font-body);letter-spacing:.5px;cursor:pointer;transition:all .4s ease;box-shadow:0 5px 15px rgba(0,0,0,.2);width:100%;margin-top:20px;animation:rainbow-button-animation 8s ease infinite}
.ai-tool-page-container button#generateButton:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 20px rgba(0,0,0,.3)}
.ai-tool-page-container button#generateButton:disabled{background:#555c66;cursor:not-allowed;transform:translateY(0) scale(1);box-shadow:0 5px 15px rgba(0,0,0,.2);animation:none}
.ai-tool-page-container .output-area{margin-top:30px;width:100%; flex-grow: 1; display: flex; flex-direction: column;}
.ai-tool-page-container .image-display-container{min-height:300px; flex-grow: 1; background-color:rgba(0,0,0,.15);border:1px solid #4a4e69;border-radius:12px;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative; margin-bottom: 15px;}
.ai-tool-page-container #generatedImageDisplay{max-width:100%;max-height: calc(100vh - 500px); border-radius:8px;display:none;object-fit:contain}
.ai-tool-page-container .placeholder-text{color:#a0a0c0;font-style:italic;font-size:.95em}
.ai-tool-page-container .loader{border:6px solid #4a4e69;border-top:6px solid var(--primary-accent-glow);border-radius:50%;width:60px;height:60px;animation:spin 1s linear infinite;display:none;position:absolute}
.ai-tool-page-container .status-message{margin-top:15px;padding:12px;border-radius:8px;font-size:.85em;display:none;font-weight:500;word-break:break-word}
.ai-tool-page-container .status-message.error{background-color:rgba(255,59,48,.15);border:1px solid #FF3B30;color:#FF3B30}
.ai-tool-page-container .status-message.info{background-color:rgba(0,122,255,.1);border:1px solid var(--primary-accent-glow);color:var(--primary-accent-glow)}
.ai-tool-page-container .status-message.success{background-color:rgba(52,199,89,.15);border:1px solid var(--success-color);color:var(--success-color)}
.ai-tool-page-container #downloadButton{background:linear-gradient(45deg,var(--success-color),#388e3c);color:#fff;border:none;padding:12px 25px;border-radius:25px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 3px 8px rgba(0,0,0,.2);margin-top:0px; display:none;  }
.ai-tool-page-container #downloadButton:hover{transform:translateY(-2px);box-shadow:0 5px 12px rgba(0,0,0,.3)}
.ai-tool-page-container .highlighted-tip { color: #FFCC00; font-weight: 500; font-size: 0.9em; padding: 12px 15px; background-color: rgba(0,0,0,0.18); border-radius: 8px; margin-top: 15px; margin-bottom: 10px; text-align: center; border-left: 4px solid #FFCC00; }
.ai-tool-page-container .prompt-controls { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.ai-tool-page-container .prompt-library-buttons button { background-color: var(--secondary-accent-glow); color: white; border: none; padding: 8px 12px; border-radius: 6px; cursor: pointer; margin-right: 5px; margin-bottom: 5px; font-size: 0.85em; }
.ai-tool-page-container .dimension-options { margin-top: 10px; text-align: left; }
.ai-tool-page-container .dimension-options span { font-size: 0.9em; color: #a0a0c0; display: block; margin-bottom: 5px;}
.ai-tool-page-container .dimension-options label { font-size: 0.85em; color: #a0a0c0; margin-right:10px; display: inline-block; margin-bottom: 5px; }
.ai-tool-page-container .dimension-options input[type="checkbox"] { margin-right: 3px; vertical-align: middle; }
.ai-tool-page-container .modal { display: none; position: fixed; z-index: 99999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.7); padding-top: 50px; backdrop-filter: blur(5px); }
.ai-tool-page-container .modal-content { background-color: #22223b; margin: 10% auto; padding: 20px; border: 1px solid #555; width: 90%; max-width: 500px; border-radius: 12px; box-shadow: 0 8px 25px rgba(0,0,0,0.4); position: relative; }
.ai-tool-page-container .modal-header { padding-bottom: 10px; border-bottom: 1px solid #4a4e69; margin-bottom:10px; }
.ai-tool-page-container .modal-header h2 { margin: 0; color: var(--primary-accent-glow); font-size: 1.3em;}
.ai-tool-page-container .close-button { color: #aaa; position: absolute; right: 10px; top: 5px; font-size: 28px; font-weight: bold; cursor: pointer; }
.ai-tool-page-container .close-button:hover, .ai-tool-page-container .close-button:focus { color: #f0f0f0; text-decoration: none; }
.ai-tool-page-container .prompt-library-list { list-style-type: none; padding: 0; max-height: 50vh; overflow-y: auto; }
.ai-tool-page-container .prompt-library-list li { padding: 10px 12px; cursor: pointer; border-bottom: 1px solid #3a3a5a; transition: background-color 0.2s; font-size: 0.9em; }
.ai-tool-page-container .prompt-library-list li:hover { background-color: #3f3f61; }
.ai-tool-page-container .prompt-library-list li:last-child { border-bottom: none; }
.ai-tool-page-container .close-generated-image { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; font-size: 18px; line-height: 28px; }
@media (max-width: 768px){.ai-tool-page-container .input-section-grid{grid-template-columns:1fr}}