/* ============================================================
   PUSULA Platform - Main CSS
   Tailwind CDN uzerinde ozellestirmeler.
   ============================================================ */

:root{
  --pusula-primary:#2563EB;
  --pusula-secondary:#0891B2;
  --pusula-success:#10B981;
  --pusula-warning:#F59E0B;
  --pusula-danger:#EF4444;
}

*{ -webkit-tap-highlight-color: transparent; }

body{
  font-family:'Inter',system-ui,sans-serif;
  color:#374151;
  background:#f9fafb;
}

h1,h2,h3,h4,h5,h6{ font-family:'Poppins',sans-serif; }

/* Scrollbar */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:#f1f5f9; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:5px; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; }

/* Custom scrollbar for dashboard lists */
.scroll-area{ max-height:24rem; overflow-y:auto; }
.scroll-area::-webkit-scrollbar{ width:6px; }
.scroll-area::-webkit-scrollbar-thumb{ background:#2563EB; border-radius:3px; }

/* Hero gradient */
.hero-gradient{
  background:linear-gradient(135deg,#2563EB 0%,#0891B2 100%);
}
.hero-gradient-soft{
  background:linear-gradient(135deg,rgba(37,99,235,.08) 0%,rgba(8,145,178,.08) 100%);
}

/* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.625rem 1.25rem; border-radius:.5rem; font-weight:600; font-size:.875rem; transition:all .2s; cursor:pointer; border:none; }
.btn-primary{ background:var(--pusula-primary); color:#fff; }
.btn-primary:hover{ background:#1d4ed8; }
.btn-secondary{ background:var(--pusula-secondary); color:#fff; }
.btn-secondary:hover{ background:#0e7490; }
.btn-success{ background:var(--pusula-success); color:#fff; }
.btn-success:hover{ background:#059669; }
.btn-outline{ background:transparent; border:1.5px solid var(--pusula-primary); color:var(--pusula-primary); }
.btn-outline:hover{ background:rgba(37,99,235,.08); }
.btn-ghost{ background:transparent; color:#6b7280; }
.btn-ghost:hover{ background:#f3f4f6; }
.btn-danger{ background:var(--pusula-danger); color:#fff; }
.btn-danger:hover{ background:#dc2626; }
.btn-sm{ padding:.375rem .75rem; font-size:.75rem; }
.btn-lg{ padding:.875rem 2rem; font-size:1rem; }
.btn-block{ width:100%; }

/* Cards */
.card{ background:#fff; border:1px solid #f3f4f6; border-radius:1rem; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.card-hover:hover{ box-shadow:0 8px 24px rgba(0,0,0,.08); transform:translateY(-2px); transition:all .2s; }

/* Forms */
.form-input,.form-select,.form-textarea{
  width:100%; padding:.625rem .875rem; border:1.5px solid #e5e7eb; border-radius:.5rem;
  font-size:.875rem; background:#fff; transition:all .15s; color:#374151;
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  outline:none; border-color:var(--pusula-primary); box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.form-label{ display:block; font-size:.8125rem; font-weight:600; color:#374151; margin-bottom:.375rem; }
.form-error{ color:var(--pusula-danger); font-size:.75rem; margin-top:.25rem; }
.form-hint{ color:#9ca3af; font-size:.75rem; margin-top:.25rem; }

/* Badges */
.badge{ display:inline-flex; align-items:center; gap:.25rem; padding:.25rem .625rem; border-radius:9999px; font-size:.6875rem; font-weight:600; }
.badge-success{ background:rgba(16,185,129,.12); color:#065f46; }
.badge-warning{ background:rgba(245,158,11,.12); color:#92400e; }
.badge-danger{ background:rgba(239,68,68,.12); color:#991b1b; }
.badge-primary{ background:rgba(37,99,235,.12); color:#1e40af; }
.badge-secondary{ background:rgba(8,145,178,.12); color:#155e75; }

/* Compass animation (logo / hero) */
.compass-rotate{ animation:compass-rotate 30s linear infinite; transform-origin:center; }
@keyframes compass-rotate{ from{transform:rotate(0)} to{transform:rotate(360deg)} }

/* Stats counter */
.stat-card{ background:#fff; border:1px solid #f3f4f6; border-radius:1rem; padding:1.25rem; }
.stat-value{ font-family:'Poppins'; font-size:1.75rem; font-weight:700; color:#111827; }
.stat-label{ font-size:.75rem; color:#6b7280; text-transform:uppercase; letter-spacing:.05em; }

/* Tables */
.table{ width:100%; border-collapse:collapse; }
.table th{ text-align:left; font-size:.75rem; font-weight:600; color:#6b7280; text-transform:uppercase; letter-spacing:.05em; padding:.75rem 1rem; background:#f9fafb; border-bottom:1px solid #e5e7eb; }
.table td{ padding:.875rem 1rem; border-bottom:1px solid #f3f4f6; font-size:.875rem; }
.table tr:hover td{ background:#fafbfc; }

/* Line clamp */
.line-clamp-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-3{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

/* Accordion */
.accordion-item{ border:1px solid #e5e7eb; border-radius:.5rem; margin-bottom:.75rem; overflow:hidden; }
.accordion-header{ width:100%; text-align:left; padding:1rem 1.25rem; background:#fff; font-weight:600; font-size:.9375rem; display:flex; justify-content:space-between; align-items:center; cursor:pointer; }
.accordion-header:hover{ background:#f9fafb; }
.accordion-body{ padding:0 1.25rem 1rem; font-size:.875rem; color:#4b5563; display:none; }
.accordion-item.open .accordion-body{ display:block; }
.accordion-item.open .accordion-icon{ transform:rotate(180deg); }
.accordion-icon{ transition:transform .2s; }

/* Flash message animations */
.flash-msg{ animation:slideInRight .3s ease; }
@keyframes slideInRight{ from{opacity:0; transform:translateX(20px)} to{opacity:1; transform:translateX(0)} }

/* Loading spinner */
.spinner{ display:inline-block; width:1.25rem; height:1.25rem; border:2px solid rgba(255,255,255,.3); border-top-color:#fff; border-radius:50%; animation:spin .6s linear infinite; }
.spinner-dark{ border-color:rgba(0,0,0,.1); border-top-color:var(--pusula-primary); }
@keyframes spin{ to{ transform:rotate(360deg) } }

/* Link underline animation */
.link-anim{ position:relative; }
.link-anim::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--pusula-secondary); transition:width .25s; }
.link-anim:hover::after{ width:100%; }