/* /css/style.css - estilo compartido */
:root{
  --color-fondo: #0A1A2F;
  --color-acento: #FFD700;
  --text-dark: #111;
  --muted: #666;
  --card-bg: #fff;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: "Poppins", Arial, sans-serif;
  background:#f5f5f5;
  color:var(--text-dark);
  -webkit-font-smoothing:antialiased;
}
.container{
  max-width:950px;
  margin:3px auto;
  background:var(--card-bg);
  padding:15px;
  border-radius:12px;
  box-shadow:0 6px 22px rgba(10,26,47,0.08);
  border-top:5px solid var(--color-acento);
}
h1,h2{margin:0 0 12px 0; color:var(--text-dark);}
label{display:block; font-weight:600; margin:12px 0 6px;}
input,textarea,select{
  width:100%;
  padding:10px;
  border-radius:8px;
  border:1px solid #d7d7d7;
  font-size:15px;
  background:#fff;
}
textarea{min-height:90px; resize:vertical;}
.btn{
  display:inline-block;
  background:var(--color-acento);
  color:#000;
  padding:12px 18px;
  border-radius:8px;
  border:0;
  font-weight:700;
  cursor:pointer;
  margin-top:18px;
}
.btn:hover{filter:brightness(.98); transform:translateY(-1px);}
.photo-preview{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;}
.photo-preview img{width:120px;border-radius:8px;border:1px solid #ddd}
.note{font-size:13px;color:var(--muted);margin-top:6px}
.small{font-size:13px;color:var(--muted)}
.status-box{padding:14px;border-left:5px solid var(--color-acento);background:#fbf9f2;border-radius:8px}

.loader {
  border: 6px solid #f3f3f3; /* color de fondo */
  border-top: 6px solid #1a73e8; /* color del spinner */
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 1s linear infinite;
  margin: 20px auto;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.photo-preview {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 8px;
  margin-top: 8px;
  padding-bottom: 4px;
}

.photo-preview img {
  width: 120px;
  height: auto;
  border-radius: 6px;
  border: 1px solid #ccc;
  object-fit: cover;
}

