/**
 * None Template - Neutral Browser Defaults
 * Story 38.4a: Minimal/neutral theme for unified Jinja rendering
 *
 * Use case: Default template for workspaces without theme configuration.
 * Characteristics: Browser defaults, no visual enhancements, semantic structure only.
 *
 * This template inherits from base.css and applies minimal overrides.
 * All pages use Jinja templates with .dir-* classes, ensuring CSS themes
 * can apply consistently across all page types.
 */

/* ============================================
   Header - Simple, no styling
   ============================================ */
.dir-header {
  padding: var(--space-4) 0;
  background-color: var(--brand-background);
  border-bottom: 1px solid var(--brand-border);
}

.dir-header-inner {
  flex-direction: row;
  align-items: center;
}

.dir-logo {
  max-height: 40px;
  max-width: 160px;
}

.dir-logo-text {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
}

/* ============================================
   Breadcrumbs - Basic styling
   ============================================ */
.dir-breadcrumb {
  padding: var(--space-3) 0;
  background-color: transparent;
  border-bottom: 1px solid var(--brand-border);
}

/* ============================================
   Cards - No decoration
   ============================================ */
.dir-card {
  border-radius: 0;
  border: 1px solid var(--brand-border);
  box-shadow: none;
}

.dir-card:hover {
  box-shadow: none;
}

.dir-card-header {
  background-color: transparent;
  border-bottom: 1px solid var(--brand-border);
}

/* ============================================
   Product Gallery - Basic styling
   ============================================ */
.dir-gallery-main {
  border-radius: 0;
  border: 1px solid var(--brand-border);
}

.dir-gallery-thumb {
  border-radius: 0;
}

/* ============================================
   Product Info - Default typography
   ============================================ */
.dir-product-title {
  font-size: var(--font-size-xl);
  letter-spacing: normal;
}

.dir-product-brand a {
  font-size: var(--font-size-sm);
  letter-spacing: normal;
}

/* ============================================
   Product Cards - No hover effects
   ============================================ */
.dir-product-card {
  border-radius: 0;
  transition: none;
}

.dir-product-card:hover {
  border-color: var(--brand-border);
  box-shadow: none;
}

.dir-product-card:hover .dir-product-card-image img {
  transform: none;
}

/* ============================================
   Buttons - Basic styling
   ============================================ */
.dir-btn {
  border-radius: 0;
}

.dir-btn-primary {
  background-color: var(--brand-accent);
}

.dir-btn-secondary {
  background-color: transparent;
}

/* ============================================
   Tables - Simple borders
   ============================================ */
.dir-table th,
.dir-table td {
  border-bottom: 1px solid var(--brand-border);
}

.dir-table-specs th {
  background-color: transparent;
}

/* ============================================
   Section Titles - No decoration
   ============================================ */
.dir-section-title {
  border-bottom: 1px solid var(--brand-border);
  padding-bottom: var(--space-2);
}

/* ============================================
   Footer - Minimal
   ============================================ */
.dir-footer {
  padding: var(--space-4) 0;
}

.dir-footer-text {
  font-size: var(--font-size-sm);
}

/* ============================================
   Prose Content - Default styling
   ============================================ */
.dir-prose {
  line-height: var(--line-height-normal);
}

.dir-prose a {
  color: var(--brand-accent);
  text-decoration: underline;
}

.dir-prose a:hover {
  text-decoration: none;
}
