/* Estilização específica da Calculadora de Horas */
:root{
--ch-container-bg:#ffffff;
--ch-container-shadow:0 4px 15px rgba(0,0,0,0.1);
--ch-radio-bg:#f8f9fa;
--ch-radio-border:#e9ecef;
--ch-radio-label-bg:#ffffff;
--ch-radio-label-border:#dee2e6;
--ch-radio-label-text:#343a40;
--ch-inputs-bg:#f8f9fa;
--ch-inputs-border:#e9ecef;
--ch-inputs-label-text:#343a40;
--ch-input-border:#e9ecef;
--ch-input-bg:#ffffff;
--ch-input-text:#343a40;
--ch-input-focus-border:#00a651;
--ch-input-focus-shadow:rgba(0,166,81,0.1);
--ch-input-hover-border:#0072bc;
--ch-h3-color:#0072bc;
--ch-label-secondary:#6c757d;
--ch-resultado-bg:linear-gradient(135deg,#f8f9fa,#ffffff);
--ch-resultado-border:#e9ecef;
--ch-resultado-text:#343a40;
--ch-resultado-success-border:#00a651;
--ch-resultado-success-bg:linear-gradient(135deg,#d4edda,#ffffff);
--ch-resultado-error-border:#dc3545;
--ch-resultado-error-bg:linear-gradient(135deg,#f8d7da,#ffffff);
--ch-resultado-error-text:#721c24;
--ch-info-bg:linear-gradient(135deg,#e3f2fd,#f8f9fa);
--ch-info-border:#0072bc;
--ch-info-text:#343a40;
--ch-info-h3-color:#0072bc;
}
[data-theme="dark"]{
--ch-container-bg:#2d2d2d;
--ch-container-shadow:0 4px 15px rgba(0,0,0,0.4);
--ch-radio-bg:#3a3a3a;
--ch-radio-border:#4a4a4a;
--ch-radio-label-bg:#2d2d2d;
--ch-radio-label-border:#495057;
--ch-radio-label-text:#e9ecef;
--ch-inputs-bg:#3a3a3a;
--ch-inputs-border:#4a4a4a;
--ch-inputs-label-text:#e9ecef;
--ch-input-border:#4a4a4a;
--ch-input-bg:#2d2d2d;
--ch-input-text:#e9ecef;
--ch-input-focus-border:#4cd964;
--ch-input-focus-shadow:rgba(76,217,100,0.15);
--ch-input-hover-border:#5ac8fa;
--ch-h3-color:#5ac8fa;
--ch-label-secondary:#adb5bd;
--ch-resultado-bg:linear-gradient(135deg,#3a3a3a,#2d2d2d);
--ch-resultado-border:#4a4a4a;
--ch-resultado-text:#e9ecef;
--ch-resultado-success-border:#4cd964;
--ch-resultado-success-bg:linear-gradient(135deg,#1d5c20,#2d2d2d);
--ch-resultado-error-border:#ff453a;
--ch-resultado-error-bg:linear-gradient(135deg,#5a2c2c,#2d2d2d);
--ch-resultado-error-text:#ff9999;
--ch-info-bg:linear-gradient(135deg,#1e3a5f,#2d2d2d);
--ch-info-border:#5ac8fa;
--ch-info-text:#e9ecef;
--ch-info-h3-color:#5ac8fa;
}
.calculadora-horas-container{display:flex;flex-direction:column;gap:1.5rem;max-width:600px;margin:auto;padding:2rem;background:var(--ch-container-bg);border-radius:12px;box-shadow:var(--ch-container-shadow);overflow:hidden;position:relative;}
.calculadora-horas-radio{display:flex;gap:1.5rem;align-items:center;justify-content:center;flex-wrap:wrap;padding:1rem;background:var(--ch-radio-bg);border-radius:8px;border:1px solid var(--ch-radio-border);}
.calculadora-horas-radio label{display:flex;align-items:center;gap:0.5rem;font-weight:600;color:var(--ch-radio-label-text);cursor:pointer;padding:0.5rem 1rem;border-radius:6px;transition:all 0.3s ease;background:var(--ch-radio-label-bg);border:1px solid var(--ch-radio-label-border);}
.calculadora-horas-radio label:hover{background:var(--ch-radio-border);transform:translateY(-1px);}
.calculadora-horas-radio input[type="radio"]{margin:0;}
.calculadora-horas-inputs{display:flex;flex-direction:column;gap:1rem;padding:1.5rem;background:var(--ch-inputs-bg);border-radius:8px;border:1px solid var(--ch-inputs-border);}
.calculadora-horas-inputs h3{margin:0 0 1rem 0;color:var(--ch-h3-color);font-weight:700;font-size:1.2rem;display:flex;align-items:center;gap:0.5rem;}
.calculadora-horas-inputs h3::before{display:none;}
.calculadora-horas-inputs label{font-weight:600;color:var(--ch-inputs-label-text);margin-bottom:0.5rem;font-size:0.95rem;display:flex;align-items:center;gap:0.5rem;}
.calculadora-horas-inputs input[type="datetime-local"],.calculadora-horas-inputs input[type="number"]{padding:0.75rem;font-size:1rem;border:2px solid var(--ch-input-border);border-radius:8px;transition:all 0.3s ease;background:var(--ch-input-bg);color:var(--ch-input-text);font-weight:500;}
.calculadora-horas-inputs input:focus{outline:none;border-color:var(--ch-input-focus-border);box-shadow:0 0 0 3px var(--ch-input-focus-shadow);transform:translateY(-1px);}
.calculadora-horas-inputs input:hover{border-color:var(--ch-input-hover-border);}
.calculadora-horas-inputs button{padding:0.75rem 1.5rem;background:linear-gradient(135deg,#00a651,#0072bc);color:white;border:none;border-radius:8px;font-weight:600;font-size:1rem;cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:0.5rem;min-height:48px;box-shadow:0 4px 15px rgba(0,0,0,0.1);margin-top:0.5rem;}
.calculadora-horas-inputs button:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,166,81,0.3);}
.calculadora-horas-inputs button:active{transform:translateY(0);}
.calculadora-horas-inputs button svg{width:16px;height:16px;}
.calculadora-horas-resultado{margin-top:1rem;padding:1.5rem;background:var(--ch-resultado-bg);border:1px solid var(--ch-resultado-border);border-radius:8px;font-family:'Courier New',monospace;font-size:1rem;color:var(--ch-resultado-text);word-break:break-word;min-height:60px;display:flex;align-items:center;justify-content:center;border-left:4px solid var(--ch-resultado-success-border);box-shadow:0 2px 10px rgba(0,0,0,0.05);transition:all 0.3s ease;font-weight:600;}
.calculadora-horas-resultado:empty{display:none;}
.calculadora-horas-resultado:not(:empty){display:flex;}
.calculadora-horas-resultado:hover{border-color:var(--ch-input-hover-border);box-shadow:0 4px 15px rgba(0,0,0,0.1);}
.input-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin-top:0.5rem;}
.input-field{display:flex;flex-direction:column;}
.input-field label{margin-bottom:0.25rem;font-size:0.9rem;color:var(--ch-label-secondary);}
.button-group{display:flex;gap:0.75rem;flex-wrap:wrap;margin-top:1rem;}
.button-group button{flex:1;min-width:140px;}
.button-group button:nth-child(2){background:linear-gradient(135deg,#6c757d,#495057);}
.button-group button:nth-child(2):hover{box-shadow:0 6px 20px rgba(108,117,125,0.3);}
.btn-icon{display:inline-flex;align-items:center;gap:0.5rem;}
#blocoDivisao{gap:1.25rem;}
#blocoDivisao h3{margin:0 0 0.75rem 0;}
#blocoDivisao label{margin-bottom:0.0rem;}
#blocoDivisao .input-group{margin-top:0.25rem;margin-bottom:0.75rem;}
#blocoDivisao .input-group+label{margin-top:0.75rem;}
#blocoDivisao .button-group{margin-top:1rem;}
#blocoDivisao .calculadora-horas-resultado{margin-top:1.25rem;}
@media (max-width:768px){
.calculadora-horas-container{padding:1.5rem;margin:1rem;}
.calculadora-horas-radio{flex-direction:row;gap:0.5rem;justify-content:center;flex-wrap:wrap;}
.calculadora-horas-radio label{flex:1;min-width:90px;max-width:140px;justify-content:center;}
.input-group{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));}
.button-group{flex-direction:column;}
.button-group button{min-width:auto;}
#blocoDivisao{gap:1rem;}
#blocoDivisao h3{margin:0 0 0.5rem 0;}
#blocoDivisao label{margin-bottom:0.25rem;}
#blocoDivisao .input-group{margin-top:0.25rem;margin-bottom:0.5rem;}
#blocoDivisao .input-group+label{margin-top:0.5rem;}
#blocoDivisao .button-group{margin-top:1rem;}
#blocoDivisao .calculadora-horas-resultado{margin-top:1rem;}
}
@media (max-width:576px){
.calculadora-horas-container{padding:1rem;margin:0.5rem;gap:1rem;}
.calculadora-horas-inputs{padding:1rem;}
.calculadora-horas-inputs input{font-size:16px;min-height:44px;}
.calculadora-horas-radio{gap:0.25rem;}
.calculadora-horas-radio label{min-width:80px;max-width:120px;padding:0.4rem 0.8rem;font-size:0.9rem;}
.input-group{grid-template-columns:repeat(auto-fit,minmax(90px,1fr));}
#blocoDivisao{gap:0.75rem;}
#blocoDivisao h3{margin:0 0 0.5rem 0;}
#blocoDivisao .input-group{margin-top:0.25rem;margin-bottom:0.5rem;}
#blocoDivisao .input-group+label{margin-top:0.5rem;}
#blocoDivisao .button-group{margin-top:0.75rem;}
#blocoDivisao .calculadora-horas-resultado{margin-top:0.75rem;}
}
/* Estados especiais */
.calculadora-horas-resultado.success{border-left-color:var(--ch-resultado-success-border);background:var(--ch-resultado-success-bg);}
.calculadora-horas-resultado.error{border-left-color:var(--ch-resultado-error-border);background:var(--ch-resultado-error-bg);color:var(--ch-resultado-error-text);}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.calculadora-horas-resultado:not(:empty){animation:fadeIn 0.3s ease;}
.calculadora-horas-inputs input:focus-visible{outline:2px solid var(--ch-input-focus-border);outline-offset:2px;}
.calculadora-horas-inputs button:focus-visible{outline:2px solid #ffffff;outline-offset:2px;}
.ch-info-box{background:var(--ch-info-bg);border-left:4px solid var(--ch-info-border);margin:2rem 0;padding:1.5rem;border-radius:8px;}
.ch-info-box h3{margin:0 0 1rem 0;color:var(--ch-info-h3-color);display:flex;align-items:center;gap:0.5rem;}
.ch-info-box p{margin:0 0 1rem 0;color:var(--ch-info-text);}
.ch-info-box a{display:inline-flex;align-items:center;gap:0.5rem;padding:0.75rem 1.5rem;background:linear-gradient(135deg,#00a651,#0072bc);color:white;text-decoration:none;border-radius:6px;font-weight:600;transition:all 0.3s ease;}
.ch-info-box a:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.2);}
[data-theme="dark"] .ch-info-box a{background:linear-gradient(135deg,#4cd964,#5ac8fa);}
[data-theme="dark"] .ch-info-box a:hover{background:linear-gradient(135deg,#5cd975,#6ad9ff);}