/**
 * SuchyConsulting.de - Modern CSS Reset
 * A comprehensive CSS reset for consistent cross-browser rendering
 * Version: 1.0
 *
 * Load this file BEFORE variables.css and other stylesheets:
 * <link rel="stylesheet" href="assets/css/reset.css">
 * <link rel="stylesheet" href="assets/css/variables.css">
 * <link rel="stylesheet" href="assets/css/style.css">
 */

/* ==========================================================================
   BOX-SIZING - Modern Box Model
   ========================================================================== */

/**
 * Use border-box for all elements
 * This makes width/height calculations include padding and border
 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* ==========================================================================
   MARGINS & PADDINGS - Reset to Zero
   ========================================================================== */

/**
 * Remove default margins and paddings from common elements
 * This provides a clean slate for custom spacing
 */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
  padding: 0;
}

/* ==========================================================================
   DOCUMENT & BODY - Base Styles
   ========================================================================== */

/**
 * Set smooth scrolling behavior
 * Respect user's motion preferences for accessibility
 */
html {
  scroll-behavior: smooth;
}

/* Disable smooth scrolling if user prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/**
 * Body defaults
 * Set minimum height, line-height, and enable font smoothing
 */
body {
  min-height: 100vh;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

/* ==========================================================================
   TYPOGRAPHY - Consistent Rendering
   ========================================================================== */

/**
 * Improve heading line-height for better readability
 */
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
  font-weight: inherit;
  text-wrap: balance; /* Better text wrapping for headings */
}

/**
 * Prevent orphaned words in paragraphs
 */
p {
  text-wrap: pretty;
}

/**
 * Remove default list styles
 * You can add them back selectively where needed
 */
ul,
ol {
  list-style: none;
}

/**
 * Improve default text rendering for better readability
 */
b,
strong {
  font-weight: bolder;
}

small {
  font-size: 0.875em;
}

/* ==========================================================================
   LINKS - Remove Default Styles
   ========================================================================== */

/**
 * Remove default link underlines
 * Add custom styles in your main stylesheet
 */
a {
  color: inherit;
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  text-decoration: none;
}

/* ==========================================================================
   MEDIA - Responsive Images & Embedded Content
   ========================================================================== */

/**
 * Make images and media responsive by default
 * Prevents overflow and maintains aspect ratio
 */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/**
 * Remove the gap between images and their containers
 */
img {
  vertical-align: middle;
}

/**
 * Prevent images from being selected (optional - remove if needed)
 */
img {
  user-select: none;
  -webkit-user-drag: none;
}

/* ==========================================================================
   FORMS - Reset Default Styles
   ========================================================================== */

/**
 * Remove default button styles
 * Inherit font properties from parent
 */
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

/**
 * Restore clickable cursor for buttons
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}

/**
 * Remove inner padding and border in Firefox
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore focus styles unset by previous rule
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/**
 * Allow vertical resize on textarea only
 */
textarea {
  resize: vertical;
  overflow: auto;
}

/**
 * Remove inner padding and search cancel button in Chrome/Safari
 */
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Correct cursor style for increment/decrement buttons
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Remove default fieldset styles
 */
fieldset {
  margin: 0;
  padding: 0;
  border: none;
}

/**
 * Reset legend display
 */
legend {
  padding: 0;
  display: table;
  max-width: 100%;
  white-space: normal;
}

/**
 * Add correct vertical alignment in Chrome/Firefox
 */
progress {
  vertical-align: baseline;
}

/* ==========================================================================
   ACCESSIBILITY - Focus Styles
   ========================================================================== */

/**
 * Remove all default outlines first
 */
:focus {
  outline: none;
}

/**
 * Add visible focus outline for keyboard navigation
 * Uses :focus-visible to show only when navigating with keyboard
 * This improves accessibility without affecting mouse users
 */
:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/**
 * Enhanced focus styles for interactive elements
 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #1e40af; /* Primary color - matches variables.css */
  outline-offset: 2px;
  border-radius: 2px;
}

/* ==========================================================================
   TABLES - Reset Default Styles
   ========================================================================== */

/**
 * Remove default table spacing
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

/**
 * Reset table cell styles
 */
td,
th {
  padding: 0;
  text-align: left;
}

/* ==========================================================================
   EMBEDDED CONTENT - Normalize Display
   ========================================================================== */

/**
 * Prevent iframe overflow
 */
iframe {
  border: 0;
  max-width: 100%;
}

/**
 * Remove border on images inside links in IE 10
 */
img {
  border-style: none;
}

/* ==========================================================================
   INTERACTIVE ELEMENTS - Normalize
   ========================================================================== */

/**
 * Add correct display in Edge/IE/Firefox
 */
details {
  display: block;
}

summary {
  display: list-item;
  cursor: pointer;
}

/**
 * Add correct display in IE 10
 */
template,
[hidden] {
  display: none;
}

/* ==========================================================================
   UTILITY RESETS
   ========================================================================== */

/**
 * Remove quotes from blockquote and q elements
 */
blockquote,
q {
  quotes: none;
}

blockquote::before,
blockquote::after,
q::before,
q::after {
  content: '';
  content: none;
}

/**
 * Prevent horizontal scrolling on small screens
 */
html,
body {
  overflow-x: hidden;
}

/**
 * Ensure consistent height calculation
 */
html {
  height: 100%;
}

body {
  min-height: 100%;
}

/**
 * Remove tap highlight on mobile devices
 */
a,
button,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}

/* ==========================================================================
   PRINT STYLES - Basic Reset
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #000 !important; /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /* Don't show links that are fragment identifiers or javascript: */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}
