body {
    font-family: 'Tahoma', Arial, Helvetica, sans-serif;
    background-color: #025f5d;
    margin: 0;
    padding: 0;
}
.container {
    max-width: 400px;
    margin: 30px auto;
    background: #182951 url("./png/fondo-512.png") no-repeat center/cover;
    padding: 32px 24px 40px 24px;
    border: 2.5px solid #0d47a1;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.08);
}
@media (max-width: 600px) {
    .container {
        background: #182951 url("./png/fondo-192.png") no-repeat center/cover;
    }
}
.skip-link {
    position: absolute;
    left: -999px;
    top: 10px;
    background: #fff;
    color: #ffffff;
    padding: 8px 18px;
    z-index: 1000;
    border-radius: 8px;
    font-weight: bold;
    box-shadow: 0 2px 8px rgba(24,41,81,0.10);
    outline: none;
    transition: left 0.2s;
}
.skip-link:focus {
    left: 10px;
    outline: 3px solid #137a13;
}
h1 {
    font-size:1.3em; text-align:center; color:#fff; margin-top:0.2em; margin-bottom:1.2em; font-weight:700;
}
h2 {
    text-align: center;
    color: #fff;
    font-size:1.3em;
    margin-top:2.2em;
}
label {
    display: block;
    margin-top: 16px;
    margin-bottom: 6px;
    color: #fff;
}
input, textarea {
    width: 95%;
    padding: 12px 16px;
    border: 1.5px solid #bdbdbd;
    border-radius: 10px;
    font-size: 1em;
    min-height: 44px;
    min-width: 44px;
    box-sizing: border-box;
    background: #f9f9fa;
}
textarea {
    width: 90%;
    min-height: 50px;
    resize: vertical;
    padding-left: 16px;
    background: #f9f9fa;
}
button {
    margin-top: 10px;
    width: 60%;
    background: #182951;
    color: #fff;
    border: none;
    padding: 12px 0;
    border-radius: 10px;
    font-size: 1.1em;
    cursor: pointer;
    min-height: 44px;
    min-width: 44px;
    transition: background 0.2s;
}
#customFileBtn {
    background: #1565c0 !important;
    color: #fff !important;
}
#customFileBtn:hover, #customFileBtn:focus {
    background: #003c8f !important;
    color: #fff !important;
}
button[type="submit"] {
    background: #00796b !important;
    color: #fff !important;
}
button[type="submit"]:hover, button[type="submit"]:focus {
    background: #004d40 !important;
    color: #fff !important;
}
button:hover, button:focus {
    background: #137a13 !important;
    color: #fff !important;
}
#descargarAppBtn, #customFileBtn {
    transition: background 0.2s;
}
#descargarAppBtn:hover, #descargarAppBtn:focus,
#customFileBtn:hover, #customFileBtn:focus {
    background: #137a13 !important;
    color: #fff !important;
}
.footer {
    text-align: center;
    margin-top: 18px;
    color: #182951;
    font-size: 0.95em;
}
.copyright-footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    background: #182951;
    color: #ffe066;
    text-align: center;
    padding: 10px 0 8px 0;
    font-size: 1em;
    z-index: 9999;
    box-shadow: 0 -2px 8px rgba(24,41,81,0.10);
}
@media (max-width: 600px) {
    .copyright-footer {
        font-size: 1em;
        padding: 14px 0 12px 0;
    }
    .container {
        padding-bottom: 60px !important;
    }
}
.container {
    padding-bottom: 40px;
}
.campo-lesco {
    margin-bottom: 18px;
}
.campo-lesco-label-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.campo-lesco label {
    margin-bottom: 0 !important;
    font-weight: 500;
}
.campo-lesco input[type="text"],
.campo-lesco textarea {
    margin-bottom: 0 !important;
}
.campo-lesco .video-icon {
    margin-left: 0 !important;
}
.video-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.video-icon img {
    display: block;
}
.video-icon .video-label {
    display: none;
    font-size: 0.95em;
    color: #182951;
    background: #e6f7ff;
    border-radius: 6px;
    padding: 1px 6px;
    margin-left: 4px;
    font-weight: 600;
}
@media (max-width: 600px) {
    .video-icon .video-label {
        display: inline;
    }
    .video-icon img {
        width: 28px;
        height: 34px;
    }
}
.video-icon[tabindex]:hover img,
.video-icon[tabindex]:focus img {
    filter: brightness(0.85) drop-shadow(0 0 4px #07ea53);
}
input:focus, textarea:focus, button:focus, .estrella:focus, .video-icon:focus {
    outline: 3px solid #137a13 !important;
    background: #e6f7ff;
}
.footer {
    color: #f9f9fa !important;
}
.copyright-footer {
    color: #fff;
}
.estrella {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2.5px solid transparent;
    transition: border 0.2s;
    font-size: 18px;
    line-height: 28px;
    margin: 0 2px;
    padding: 0;
    box-sizing: border-box;
    vertical-align: middle;
}
.estrella > * {
    display: block;
    line-height: 1;
}
.estrella.seleccionada {
    border: 2.5px solid #fcf815;
}
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
