.periods-view{display:flex;flex-direction:column;gap:16px}.period-toolbar{display:flex;align-items:flex-end;gap:10px;padding:12px 14px;background:#f4f7f9;border:1px solid #d9e0e5;border-radius:9px}.period-toolbar label{display:flex;flex-direction:column;gap:4px;color:#526574;font-size:9px;font-weight:700}.period-toolbar input{padding:8px 10px;border:1px solid #c7d0d8;border-radius:6px;color:#263746;background:#fff}.period-toolbar .button{font-size:10px;padding:8px 11px}.period-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.period-metric{padding:12px 14px;border:1px solid #d9e0e5;border-radius:9px;background:#fff}.period-metric span{display:block;color:#71818c;font-size:9px;text-transform:uppercase}.period-metric strong{display:block;margin-top:5px;color:#29495c;font-size:22px}.period-metric.current strong{color:#2f806b}.period-metric.overdue strong{color:#b4544e}.period-metric.future strong{color:#967337}.period-layout{display:grid;grid-template-columns:1fr 1.25fr;gap:14px}.period-status,.period-history{padding:15px}.period-status h2,.period-history h2{font-size:14px;margin:0}.period-frequency{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}.period-frequency span{display:flex;justify-content:space-between;padding:10px;border:1px solid #e2e7ea;border-radius:8px;color:#627582;font-size:10px}.period-frequency strong{color:#29495c}.period-note{margin:14px 0 0;padding:10px;border-radius:8px;background:#f4f8f7;color:#667b83;font-size:10px;line-height:1.5}.period-badge{display:inline-block;padding:4px 7px;border-radius:999px;background:#e7f3ed;color:#277158;font-size:8px}.period-badge.generado{background:#e5eff5;color:#315f78}.periods-view .upload-message.success{background:#edf8f2;color:#287458;border-color:#cce8d9}@media(max-width:850px){.period-layout{grid-template-columns:1fr}.period-metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.period-toolbar{align-items:stretch;flex-direction:column}.period-toolbar .button{width:100%}}
