/**
 * FORMN Industrial UI - Hard Edge Styling Override
 * 
 * This stylesheet enforces 0px border-radius on ALL elements
 * for the industrial, rugged look of FORMN SaaS.
 * 
 * Colors: 
 *   - Headers/Sidebars: Navy Blue (#0F172A)
 *   - Primary Buttons: Safety Yellow (#FFD700) with Black text
 */

/* ===========================================
   CSS CUSTOM PROPERTIES (FORMN Theme)
   =========================================== */
:root {
  /* Primary Colors */
  --formn-primary: #0F172A;
  --formn-primary-light: #1E293B;
  --formn-primary-dark: #020617;
  
  /* Accent - Safety Yellow */
  --formn-accent: #FFD700;
  --formn-accent-hover: #FFC700;
  --formn-accent-text: #000000;
  
  /* Status */
  --formn-success: #22C55E;
  --formn-warning: #F59E0B;
  --formn-danger: #EF4444;
  --formn-info: #3B82F6;
  
  /* Neutrals */
  --formn-background: #F8FAFC;
  --formn-border: #E2E8F0;
  --formn-text-primary: #0F172A;
  --formn-text-secondary: #64748B;
  
  /* CRITICAL: Force zero border-radius */
  --formn-border-radius: 0px;
}

/* ===========================================
   GLOBAL BORDER-RADIUS OVERRIDE
   Hard edges ONLY - Industrial aesthetic
   =========================================== */

/* Universal reset for all elements */
*,
*::before,
*::after {
  border-radius: 0px !important;
}

/* Bootstrap specific overrides */
.rounded,
.rounded-0,
.rounded-1,
.rounded-2,
.rounded-3,
.rounded-4,
.rounded-5,
.rounded-circle,
.rounded-pill,
.rounded-top,
.rounded-end,
.rounded-bottom,
.rounded-start {
  border-radius: 0px !important;
}

/* Cards */
.card,
.card-header,
.card-body,
.card-footer,
.card-img,
.card-img-top,
.card-img-bottom {
  border-radius: 0px !important;
}

/* Buttons */
.btn,
.btn-sm,
.btn-lg,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-light,
.btn-dark,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-light,
.btn-outline-dark,
.btn-link,
.btn-close {
  border-radius: 0px !important;
}

/* Form Controls */
.form-control,
.form-select,
.form-check-input,
.form-range,
.input-group,
.input-group-text {
  border-radius: 0px !important;
}

/* Dropdowns */
.dropdown-menu,
.dropdown-item,
.dropdown-toggle {
  border-radius: 0px !important;
}

/* Modals */
.modal,
.modal-dialog,
.modal-content,
.modal-header,
.modal-body,
.modal-footer {
  border-radius: 0px !important;
}

/* Alerts & Badges */
.alert,
.badge {
  border-radius: 0px !important;
}

/* Progress bars */
.progress,
.progress-bar {
  border-radius: 0px !important;
}

/* List groups */
.list-group,
.list-group-item {
  border-radius: 0px !important;
}

/* Pagination */
.pagination,
.page-link,
.page-item {
  border-radius: 0px !important;
}

/* Navs */
.nav,
.nav-link,
.nav-tabs,
.nav-pills,
.navbar,
.navbar-brand,
.navbar-nav {
  border-radius: 0px !important;
}

/* Toasts */
.toast,
.toast-header,
.toast-body {
  border-radius: 0px !important;
}

/* Tooltips & Popovers */
.tooltip,
.tooltip-inner,
.tooltip-arrow,
.popover,
.popover-header,
.popover-body {
  border-radius: 0px !important;
}

/* Spinners */
.spinner-border,
.spinner-grow {
  border-radius: 0px !important;
}

/* Tables */
.table,
.table-responsive {
  border-radius: 0px !important;
}

/* Images - unless explicitly circular avatars */
img:not(.avatar-circle) {
  border-radius: 0px !important;
}

/* ===========================================
   FORMN PRIMARY BUTTON STYLE
   Safety Yellow with Black text
   =========================================== */
.btn-formn-primary,
.btn-formn-accent {
  background-color: var(--formn-accent) !important;
  border-color: var(--formn-accent) !important;
  color: var(--formn-accent-text) !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-radius: 0px !important;
  transition: all 0.2s ease;
}

.btn-formn-primary:hover,
.btn-formn-accent:hover {
  background-color: var(--formn-accent-hover) !important;
  border-color: var(--formn-accent-hover) !important;
  color: var(--formn-accent-text) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.btn-formn-primary:active,
.btn-formn-accent:active {
  transform: translateY(0);
  box-shadow: none;
}

/* Secondary - Navy Blue */
.btn-formn-secondary {
  background-color: var(--formn-primary) !important;
  border-color: var(--formn-primary) !important;
  color: #FFFFFF !important;
  border-radius: 0px !important;
}

.btn-formn-secondary:hover {
  background-color: var(--formn-primary-light) !important;
  border-color: var(--formn-primary-light) !important;
}

/* Outline variant */
.btn-formn-outline {
  background-color: transparent !important;
  border: 2px solid var(--formn-accent) !important;
  color: var(--formn-primary) !important;
  border-radius: 0px !important;
}

.btn-formn-outline:hover {
  background-color: var(--formn-accent) !important;
  color: var(--formn-accent-text) !important;
}

/* ===========================================
   FORMN CARD STYLES
   Industrial card with navy header
   =========================================== */
.card-formn {
  border: 1px solid var(--formn-border);
  border-radius: 0px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.card-formn .card-header {
  background-color: var(--formn-primary) !important;
  color: #FFFFFF !important;
  border-radius: 0px !important;
  border-bottom: 3px solid var(--formn-accent);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 0.85rem;
}

.card-formn .card-body {
  background-color: #FFFFFF;
  border-radius: 0px !important;
}

/* ===========================================
   FORMN SIDEBAR STYLES
   Navy Blue background
   =========================================== */
.sidebar-formn,
.formn-sidebar {
  background-color: var(--formn-primary) !important;
  color: var(--formn-sidebar-text, #FFFFFF);
}

.sidebar-formn .nav-link,
.formn-sidebar .nav-link {
  color: rgba(255, 255, 255, 0.8);
  border-radius: 0px !important;
  transition: all 0.2s ease;
}

.sidebar-formn .nav-link:hover,
.formn-sidebar .nav-link:hover {
  background-color: var(--formn-primary-light);
  color: #FFFFFF;
}

.sidebar-formn .nav-link.active,
.formn-sidebar .nav-link.active {
  background-color: var(--formn-accent) !important;
  color: var(--formn-accent-text) !important;
  font-weight: 600;
}

/* ===========================================
   FORMN TABLE STYLES
   Clean industrial tables
   =========================================== */
.table-formn {
  border-collapse: collapse;
}

.table-formn thead th {
  background-color: var(--formn-primary) !important;
  color: #FFFFFF !important;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.5px;
  border: none;
  padding: 12px 16px;
}

.table-formn tbody td {
  border-bottom: 1px solid var(--formn-border);
  padding: 12px 16px;
  vertical-align: middle;
}

.table-formn tbody tr:hover {
  background-color: rgba(15, 23, 42, 0.03);
}

/* ===========================================
   FORMN BADGE STYLES
   Status indicators
   =========================================== */
.badge-formn-pending {
  background-color: #FEF3C7 !important;
  color: #92400E !important;
  border-radius: 0px !important;
}

.badge-formn-approved {
  background-color: #DCFCE7 !important;
  color: #166534 !important;
  border-radius: 0px !important;
}

.badge-formn-rejected {
  background-color: #FEE2E2 !important;
  color: #991B1B !important;
  border-radius: 0px !important;
}

.badge-formn-completed {
  background-color: #E0E7FF !important;
  color: #3730A3 !important;
  border-radius: 0px !important;
}

/* ===========================================
   FORMN HEADER/NAVBAR
   Navy Blue gradient
   =========================================== */
.navbar-formn,
.formn-header {
  background: var(--formn-primary) !important;
  border-radius: 0px !important;
}

.navbar-formn .navbar-brand,
.formn-header .brand-name {
  color: #FFFFFF !important;
  font-weight: 700;
  letter-spacing: 1px;
}

/* ===========================================
   FORMN STAT CARD
   Industrial KPI cards
   =========================================== */
.stat-card-formn {
  border: 1px solid var(--formn-border);
  border-left: 4px solid var(--formn-accent);
  border-radius: 0px !important;
  background: #FFFFFF;
  transition: all 0.2s ease;
}

.stat-card-formn:hover {
  border-left-color: var(--formn-primary);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.stat-card-formn .stat-value {
  font-size: 2rem;
  font-weight: 700;
  color: var(--formn-primary);
}

.stat-card-formn .stat-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--formn-text-secondary);
}

/* ===========================================
   FORMN ALERT ITEM
   Industrial warning/info boxes
   =========================================== */
.alert-item-formn {
  border-left: 4px solid;
  border-radius: 0px !important;
  padding: 12px 16px;
  background: rgba(248, 250, 252, 0.8);
}

.alert-item-formn.danger {
  border-left-color: var(--formn-danger);
  background-color: rgba(239, 68, 68, 0.05);
}

.alert-item-formn.warning {
  border-left-color: var(--formn-warning);
  background-color: rgba(245, 158, 11, 0.05);
}

.alert-item-formn.info {
  border-left-color: var(--formn-info);
  background-color: rgba(59, 130, 246, 0.05);
}

.alert-item-formn.success {
  border-left-color: var(--formn-success);
  background-color: rgba(34, 197, 94, 0.05);
}

/* ===========================================
   UTILITY CLASSES
   =========================================== */
.bg-formn-primary {
  background-color: var(--formn-primary) !important;
}

.bg-formn-accent {
  background-color: var(--formn-accent) !important;
}

.text-formn-primary {
  color: var(--formn-primary) !important;
}

.text-formn-accent {
  color: var(--formn-accent) !important;
}

.border-formn-accent {
  border-color: var(--formn-accent) !important;
}

/* Force hard edges on focus states too */
*:focus {
  border-radius: 0px !important;
  outline-offset: 2px;
}

/* ===========================================
   RESPONSIVE ADJUSTMENTS
   =========================================== */
@media (max-width: 767.98px) {
  .stat-card-formn .stat-value {
    font-size: 1.5rem;
  }
  
  .table-formn thead th {
    font-size: 0.7rem;
    padding: 8px 12px;
  }
  
  .table-formn tbody td {
    padding: 8px 12px;
  }
}
