/* Kyriazakos Quotation Form Styles */
* { 
    margin:0; 
    padding:0; 
    box-sizing:border-box; 
}

body { 
    font-family:'Arial',sans-serif; 
    background:#ffffff; 
    color:#333; 
    line-height:1.6; 
}

.quote-form-container { 
    max-width:800px; 
    margin:0 auto; 
    padding:20px; 
    background:#ffffff; 
    box-shadow:0 0 20px rgba(0,0,0,0.1); 
    border-radius:10px; 
}

.quote-form-container .header { 
    margin-bottom:30px; 
    padding-bottom:20px; 
    border-bottom:3px solid #ED7600; 
    position:relative; 
}

.quote-form-container .logo { 
    width:150px; 
    height:auto; 
    float:right; 
    margin-bottom:10px; 
}

.quote-form-container .header-text { 
    clear:both; 
    text-align:center; 
    margin-top:10px; 
}

.quote-form-container .header-text h1 { 
    color:#ED7600; 
    margin-bottom:5px; 
    font-size:28px; 
}

.quote-form-container .header-text p { 
    color:#4A4A4A; 
    font-size:16px; 
}

.form-section { 
    margin-bottom:25px; 
    padding:20px; 
    border:1px solid #e0e0e0; 
    border-radius:8px; 
    background:#fafafa; 
}

.form-section h3 { 
    color:#ED7600; 
    margin-bottom:15px; 
    border-bottom:2px solid #ED7600; 
    padding-bottom:5px; 
}

.form-group { 
    margin-bottom:15px; 
}

.form-group label { 
    display:block; 
    margin-bottom:5px; 
    font-weight:bold; 
    color:#4A4A4A; 
}

.required { 
    color:#ED7600; 
}

.form-group input, 
.form-group select, 
.form-group textarea { 
    width:100%; 
    padding:10px; 
    border:2px solid #ddd; 
    border-radius:5px; 
    font-size:14px; 
    transition:border-color .3s ease; 
}

.form-group input:focus, 
.form-group select:focus, 
.form-group textarea:focus { 
    outline:none; 
    border-color:#ED7600; 
}

.form-group input:disabled, 
.form-group select:disabled { 
    background:#f5f5f5; 
    color:#999; 
    cursor:not-allowed; 
}

.form-row { 
    display:flex; 
    gap:15px; 
}

.form-row .form-group { 
    flex:1; 
}

.dynamic-fields { 
    display:none; 
    margin-top:15px; 
    padding:15px; 
    background:#f0f0f0; 
    border-radius:5px; 
}

.dynamic-fields.active { 
    display:block; 
}

.thumbnail-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
    gap:15px;
    margin-top:15px;
}

.thumbnail-option {
    border:2px solid #ddd;
    border-radius:8px;
    padding:15px;
    text-align:center;
    cursor:pointer;
    transition:all .3s ease;
    position:relative;
    background:#fff;
    box-shadow:0 2px 4px rgba(0,0,0,0.1);
}

.thumbnail-option:hover { 
    border-color:#ED7600; 
}

.thumbnail-option.selected { 
    border-color:#ED7600; 
    background:#fff2e6; 
}

.thumbnail-option input[type="checkbox"] { 
    position:absolute; 
    top:5px; 
    right:5px; 
    width:20px; 
    height:20px; 
}

.thumbnail-option img {
    width:100%;
    height:auto;
    max-height:120px;
    object-fit:contain;
    border-radius:6px;
    margin-bottom:10px;
    background:#f9f9f9;
}

.thumbnail-option label {
    font-size:13px;
    font-weight:500;
    margin:0;
    cursor:pointer;
    color:#333;
    line-height:1.3;
}

.checkbox-group { 
    display:flex; 
    align-items:center; 
    margin-top:15px; 
}

.checkbox-group input[type="checkbox"] { 
    width:auto; 
    margin-right:10px; 
}

.submit-section { 
    text-align:center; 
    margin-top:30px; 
    padding:20px; 
    background:#4A4A4A; 
    border-radius:8px; 
}

.submit-btn { 
    background:#ED7600; 
    color:#fff; 
    border:none; 
    padding:15px 40px; 
    font-size:18px; 
    border-radius:5px; 
    cursor:pointer; 
    transition:background-color .3s ease; 
}

.submit-btn:hover { 
    background:#d66600; 
}

.submit-btn:disabled { 
    background:#999; 
    cursor:not-allowed; 
}

.privacy-text { 
    color:#ffffff; 
    font-size:12px; 
    margin-top:10px; 
}

.privacy-text a { 
    color:#ED7600; 
    text-decoration:none; 
}

.version { 
    text-align:right; 
    color:#999; 
    font-size:10px; 
    margin-top:20px; 
}

/* Loading states */
.kqf-loading { 
    opacity:0.6; 
    pointer-events:none; 
}

.kqf-loading .submit-btn { 
    background:#999; 
}

/* Success/Error messages */
.kqf-message {
    padding:15px;
    margin:15px 0;
    border-radius:5px;
    font-weight:bold;
    animation: slideIn 0.5s ease-out;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.kqf-message.success { 
    background:#d4edda; 
    color:#155724; 
    border:1px solid #c3e6cb; 
}

.kqf-message.error { 
    background:#f8d7da; 
    color:#721c24; 
    border:1px solid #f5c6cb; 
}

/* Mobile Responsive */
@media (max-width:768px) { 
    .quote-form-container { 
        margin:10px; 
        padding:15px; 
    } 
    
    .logo { 
        width:120px; 
        float:none; 
        display:block; 
        margin:0 auto 10px auto; 
    } 
    
    .form-row { 
        flex-direction:column; 
    } 
    
    .thumbnail-grid {
        grid-template-columns:repeat(2,1fr);
    }
}

/* Custom Checkbox Styling - Dark Grey */
input[type="checkbox"] {
    accent-color: #4a4a4a; /* Modern browsers */
    width: 16px;
    height: 16px;
}

/* For older browsers - custom checkbox styling */
input[type="checkbox"]:not(.thumbnail-option input) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border: 2px solid #ccc;
    border-radius: 3px;
    background: #fff;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
}

input[type="checkbox"]:not(.thumbnail-option input):checked {
    background: #4a4a4a;
    border-color: #4a4a4a;
}

input[type="checkbox"]:not(.thumbnail-option input):checked::after {
    content: "✓";
    position: absolute;
    top: -2px;
    left: 1px;
    color: white;
    font-size: 12px;
    font-weight: bold;
}

input[type="checkbox"]:not(.thumbnail-option input):hover {
    border-color: #4a4a4a;
}

/* GDPR Consent Checkbox Specific Styling */
#gdpr_consent {
    accent-color: #4a4a4a;
    transform: scale(1.2);
    margin-right: 8px;
}

/* Thumbnail checkboxes keep their original positioning */
.thumbnail-option input[type="checkbox"] {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 20px;
    height: 20px;
    accent-color: #4a4a4a;
}